/* The tester has two scroll containers; the page itself never scrolls on desktop. */
@media(min-width:721px){html,body{height:100%;overflow:hidden}.workspace{height:100dvh;min-height:0;overflow:hidden}.workspace>aside{height:100%;overflow-y:auto;overscroll-behavior:contain}.workspace>#brand-screen{height:100%;min-height:0}.screen>.stage{min-height:0}.screen>header,.screen>footer{flex-shrink:0}.screen .controls{flex-wrap:wrap}.isolated .workspace>#brand-screen{height:100dvh;min-height:0}}
#tester-view-controls{position:sticky;top:-24px;z-index:5;margin:-24px -24px 0;padding:18px 24px;background:#f5f5eff5;border-bottom:1px solid #d8dbd1;backdrop-filter:blur(12px)}
#tester-view-controls .segments{margin-top:8px}.kit-toggle-label{font:10px monospace;letter-spacing:.09em;color:#687063}
#mockup-view{height:100%;min-width:0;overflow-y:auto;overscroll-behavior:contain;background:#eaece7;color:#202622;padding:28px;container-type:inline-size}
.kit-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:2px 0 24px}.kit-heading h2{font-size:clamp(26px,3.2cqw,42px);font-weight:400;letter-spacing:-.04em;margin:8px 0 0}.kit-heading p{font-size:12px;max-width:230px}.kit-note{font:10px ProductGeistMono,monospace;text-transform:uppercase;letter-spacing:.06em;color:#5e6d61}
.kit-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}.kit-tile{position:relative;overflow:hidden;border-radius:14px;min-width:0;background:#d6ddd2}.kit-tile-label{position:absolute;left:20px;top:18px;z-index:3;font:9px ProductGeistMono,monospace;letter-spacing:.06em;text-transform:uppercase;color:#4f5b50;pointer-events:none}.kit-tile-label.light{color:#bcc8b9}.kit-tile-caption{position:absolute;bottom:18px;left:20px;z-index:3;font-size:11px;color:#53614f}
.kit-tile.desktop{grid-column:span 8;min-height:360px;aspect-ratio:1.35;background:radial-gradient(ellipse at 50% 0%,#f2f5ed,#c3cdbb)}
.kit-tile.phone{grid-column:span 4;background:#cdc2af;display:flex;align-items:center;justify-content:center}
.phone-scene{width:155%;flex-shrink:0;aspect-ratio:1;position:relative}.phone-scene>img{width:100%;height:100%;display:block}
.phone-display{position:absolute;left:30.75%;top:7.8%;width:38.45%;height:79%;background:#171918;border-radius:13% / 6.4%;overflow:hidden}
.phone-site{position:absolute;top:0;left:0;width:390px;height:802px;transform-origin:0 0;background:#171918;color:#edf1e8;overflow:hidden}.phone-status{height:52px;display:flex;justify-content:space-between;align-items:center;padding:0 30px;font:12px Arial,sans-serif}.phone-island{position:absolute;top:10px;left:136px;width:118px;height:29px;background:#080909;border-radius:30px}.phone-nav{display:flex;justify-content:space-between;align-items:center;padding:13px 26px;border-bottom:1px solid #ffffff14}.phone-menu{font-size:25px;line-height:1}.phone-copy{padding:38px 26px 0;position:relative;z-index:1}.phone-copy .kit-note{font-size:9px;color:#adbaaa}.phone-copy h3{font-size:52px;font-weight:400;letter-spacing:-.045em;line-height:.99;margin:20px 0 18px}.phone-copy p{font-size:15px;line-height:1.45;color:#b5bfb0;max-width:275px}.phone-cta{display:inline-block;border:1px solid #dbe7d1;padding:13px 18px;border-radius:7px;font-size:14px;margin-top:22px;background:#dce8d5;color:#1c271b}.phone-art{position:absolute;inset:0;width:390px;height:802px;max-height:none;aspect-ratio:auto;opacity:.85;z-index:0}.phone-bottom{position:absolute;bottom:8px;width:110px;height:4px;left:140px;border-radius:8px;background:#dfe6dc}
.laptop{position:absolute;width:88%;left:6%;top:20%;filter:drop-shadow(0 26px 20px #32402d35)}.laptop-lid{padding:9px 9px 13px;border-radius:14px 14px 5px 5px;background:linear-gradient(140deg,#535953,#181c19 35%,#343a34);border:1px solid #667164;position:relative}.laptop-camera{width:3px;height:3px;border-radius:50%;position:absolute;top:3px;left:50%;background:#151a16}.library-screen{position:relative;aspect-ratio:1280/720;overflow:hidden;border-radius:4px;background:white}.library-native{position:absolute;width:1280px;height:720px;transform-origin:0 0}.library-native>img{display:block;width:1280px;height:720px}.library-logo-overlay{position:absolute;left:12px;top:22px;width:186px;height:56px;display:flex;align-items:center;padding-left:8px;background:#f6f8f7}.laptop-base{height:15px;width:110%;margin-left:-5%;background:linear-gradient(#9ca39b,#d9ddd6 25%,#818980 60%,#666d63);border-radius:2px 2px 45% 45%;position:relative}.laptop-base:before{content:'';position:absolute;left:42%;top:0;width:16%;height:5px;background:#757e74;border-radius:0 0 8px 8px}
.kit-tile.cap,.kit-tile.hoodie{grid-column:span 4;aspect-ratio:1}.garment-photo{width:100%;height:100%;object-fit:cover;display:block}.cap-stamp{position:absolute;left:42%;top:34%;width:16%;aspect-ratio:1;display:grid;place-items:center;filter:drop-shadow(0 1px 1px #121612)}.cap-stamp img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(.94);opacity:.93}.hoodie-stamp{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);mix-blend-mode:multiply;opacity:.87;white-space:nowrap;scale:.8;transform-origin:center}.hoodie-stamp .kit-logo{--kit-type:22px}
.kit-tile.identity{grid-column:span 4;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#1c2924;color:#e3eedf;padding:26px}.identity .kit-brand{max-width:100%}.identity .kit-logo{--kit-type:clamp(27px,3.8cqw,48px)}.identity p{font-size:13px;line-height:1.4;color:#adbeab;margin-top:30px;text-align:center;max-width:190px}.identity-rule{width:42px;height:1px;background:#7d987d;margin:24px 0 0}
.kit-tile.texture{grid-column:span 8;min-height:290px;aspect-ratio:2.3;background:#171918;color:#ecf0e8}.kit-texture{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto}.texture>.kit-brand{position:absolute;top:24px;left:24px;z-index:2}.texture>.kit-brand .kit-logo{--kit-type:20px}.texture h3{position:absolute;left:26px;bottom:24px;margin:0;font-size:clamp(30px,4.5cqw,56px);font-weight:400;line-height:.98;letter-spacing:-.045em;z-index:2}.texture:after{content:'';position:absolute;inset:0;background:linear-gradient(#17191850,transparent,#171918aa);pointer-events:none}
.kit-tile.stationery{grid-column:span 4;min-height:290px;display:grid;place-items:center;background:#d2dccb;padding:40px}.business-card{background:#f2f3e9;transform:rotate(-8deg);padding:25px 22px;width:100%;aspect-ratio:1.7;box-shadow:8px 24px 22px #53624b25;display:flex;flex-direction:column;justify-content:space-between}.business-card .kit-logo{--kit-type:22px}.business-card small{font:7px ProductGeistMono,monospace;color:#697664;letter-spacing:.04em}.kit-footer{display:flex;justify-content:space-between;gap:20px;padding:20px 0 5px;font-size:11px;color:#63705e}.kit-footer a{color:inherit}
.kit-logo{--kit-type:24px;display:inline-flex;align-items:center;gap:calc(var(--kit-type)*.414);font-family:Montreal,Arial,sans-serif;white-space:nowrap;line-height:1;color:inherit}.kit-logo>img{width:calc(var(--kit-type)*1.103);height:calc(var(--kit-type)*1.103);object-fit:contain;flex:none}.kit-logo>span{font-size:var(--kit-type);letter-spacing:-.04em;line-height:1}.kit-logo.lower>span{transform:translateY(-.103em)}.kit-logo.tall{gap:calc(var(--kit-type)*.759)}.kit-logo.tall>img{width:calc(var(--kit-type)*1.379);height:calc(var(--kit-type)*1.379)}.kit-logo.middle{gap:calc(var(--kit-type)*.586)}.kit-logo .kit-integrated{height:var(--kit-type);width:auto;max-width:100%}.kit-brand.light img{filter:brightness(0) invert(1)}.kit-brand.dark img{filter:brightness(0)}.phone-nav .kit-logo{--kit-type:24px}.library-logo-overlay .kit-logo{--kit-type:24px}.kit-logo .product-lockup{transform-origin:left center}.kit-brand{color:inherit}
body.kit-mode #enter-isolation,body.kit-mode .isolate-hint{display:none}.kit-panel-note{font-size:11px;line-height:1.4;margin-top:10px}
@media(max-width:1100px) and (min-width:721px){#mockup-view{padding:20px}.kit-tile.desktop{grid-column:span 12;aspect-ratio:1.65}.kit-tile.phone{grid-column:span 6;grid-row:span 2;min-height:500px}.kit-tile.cap,.kit-tile.hoodie{grid-column:span 6}.kit-tile.identity{grid-column:span 5}.kit-tile.texture{grid-column:span 7;aspect-ratio:1;min-height:0}.kit-tile.stationery{grid-column:span 12;min-height:230px}.business-card{max-width:280px}.hoodie-stamp{scale:.65}.kit-heading{align-items:start}.kit-heading p{max-width:180px}}
@media(max-width:720px){#mockup-view{height:auto;overflow:visible;padding:16px}.kit-heading{display:block}.kit-heading p{margin-top:12px;max-width:none}.kit-tile.desktop{grid-column:span 12;min-height:240px;aspect-ratio:1.5}.kit-tile.phone{grid-column:span 12;aspect-ratio:.85}.phone-scene{width:120%}.kit-tile.cap,.kit-tile.hoodie{grid-column:span 6}.kit-tile.identity,.kit-tile.texture,.kit-tile.stationery{grid-column:span 12;aspect-ratio:1.6;min-height:220px}.identity .kit-logo{--kit-type:38px}.identity p{margin-top:18px}.hoodie-stamp{scale:.45}.kit-tile-label{left:14px;top:13px;font-size:8px}.kit-footer{flex-direction:column;gap:8px}#tester-view-controls{top:0}.kit-mode .workspace>aside{order:-1}.kit-mode .workspace>aside>section:not(#tester-view-controls),.kit-mode .workspace>aside>.foot{display:none}.kit-mode .workspace>aside.kit-controls-open>section,.kit-mode .workspace>aside.kit-controls-open>.foot{display:block}.kit-mode .workspace>aside>div:not(#tester-view-controls){display:none}.kit-mode .workspace>aside{padding-top:0;padding-bottom:0}.kit-mobile-controls{display:block!important;width:100%;margin-top:8px;background:transparent;border:0;text-align:left;padding:8px 0;font-size:12px}}
.kit-mobile-controls{display:none}
.kit-motion-button{margin-top:12px;border:1px solid #b5c1af;border-radius:6px;padding:6px 10px;background:transparent;font-size:11px;color:#43513d}.kit-mode #logo-reveal-controls{display:none}
.kit-brand.light .product-lockup{color:#e9eeeb}.kit-brand.light .product-tile{background:#dce8e0;color:#202a24}.kit-brand.light .product-beta{color:#a6b0aa}
.kit-mode #connection-timeline,.kit-mode #texture-controls>label:first-child,.kit-mode #morph{display:none}
@media(max-width:720px){body{overflow-x:hidden}#tester-view-controls{margin:0 -24px;padding:16px 24px}.kit-mode .workspace>aside.kit-controls-open>section:not(#tester-view-controls){display:block}.kit-mode .workspace>aside.kit-controls-open>#logo-reveal-controls{display:none}.kit-tile.desktop{min-height:290px;aspect-ratio:1.24}.laptop{top:16%}}
.kit-mode #texture-controls>label[for="morph"]{display:none!important}
@media(max-width:720px){.kit-mode .workspace>aside.kit-controls-open>section#logo-reveal-controls{display:none}.kit-mobile-controls{display:none!important}.kit-mode .kit-mobile-controls{display:block!important}}

/* Shared badge and true one-color Thread artwork; product components stay unchanged. */
.brand-beta{display:none;font:500 9px/1 ProductGeistMono,monospace;letter-spacing:.02em;color:inherit;opacity:.72;flex:none;transform:none}
.show-beta .brand-beta{display:inline-block}
.beta-pair{display:flex;align-items:center;gap:8px}
.beta-control{display:flex;align-items:center;gap:10px;font-size:14px;cursor:pointer}
.beta-control input{width:17px;height:17px;accent-color:#52674c}
.product-lockup .product-tile,.screen .product-tile,.kit-brand.light .product-tile{display:block;object-fit:contain;background:transparent;color:inherit;border-radius:0}
.screen .product-tile{filter:brightness(0) invert(1)}
.product-name.optical-lowercase{transform:translateY(-.103em)}
.product-tile svg{visibility:hidden}
/* Repeat the photo only over the cords, so they physically occlude the live print. */
.hoodie-cords{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;clip-path:polygon(46.1% 28%,47.6% 28%,47.6% 32%,47.1% 35%,46% 38%,45.8% 41.2%,46% 43.7%,44% 44%,43.8% 42%,44.5% 39%,44.7% 36.5%,45.7% 33%,46.1% 30%,46.1% 28%,52% 28%,53% 28%,53.4% 33%,54.5% 36%,55.5% 39%,55.7% 41.7%,56.2% 43.7%,54.3% 44%,54% 42%,54% 39.5%,53.2% 36%,52.2% 33%,52% 28%)}
.phone-site:after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,#17191835 0%,#17191885 18%,#17191895 47%,#17191815 80%);pointer-events:none}
.phone-status,.phone-nav,.phone-copy{position:relative;z-index:2}
.phone-island,.phone-bottom{z-index:3}

/* Stationery defaults to notebook + pen; the earlier hoodie remains selectable. */
.merchandise{container-type:inline-size}.kit-notebook-scene,.kit-hoodie-scene{position:absolute;inset:0}
.notebook-stamp{position:absolute;left:45.6%;top:43%;transform:translate(-50%,-50%);color:#242927;mix-blend-mode:multiply;opacity:.9;filter:drop-shadow(0 1px 0 #ffffff50)}
.notebook-stamp .kit-logo{--kit-type:7cqw}.notebook-line{position:absolute;left:29%;top:73%;font:2.1cqw ProductGeistMono,monospace;letter-spacing:.12em;color:#42473e;mix-blend-mode:multiply}
.pen-stamp{position:absolute;left:79.1%;top:59.5%;transform:translate(-50%,-50%) rotate(-90deg);color:#d4d6d0;opacity:.8}
.pen-stamp .kit-logo{--kit-type:2.3cqw}.merchandise .brand-beta{font-size:calc(var(--kit-type)*.32)}
.merchandise .product-lockup,.poster-print .product-lockup{gap:calc(var(--kit-type)*.333);line-height:1}
.merchandise .product-name,.poster-print .product-name{font-size:var(--kit-type);line-height:1}
.merchandise .product-tile,.poster-print .product-tile{width:calc(var(--kit-type)*1.167);height:calc(var(--kit-type)*1.167)}
#kit-object{position:absolute;z-index:4;bottom:12px;left:14px;max-width:calc(100% - 28px);font:9px ProductGeistMono,monospace;background:#f5f5efe8;color:#354033;border:1px solid #35403325;border-radius:5px;padding:5px 7px;cursor:pointer}
#kit-object:focus-visible{outline:2px solid #52674c;outline-offset:3px}
.kit-tile.outdoor{grid-column:span 12;aspect-ratio:3/2;background:#b2aaa0}.outdoor-photo{width:100%;height:100%;display:block}.outdoor .kit-tile-caption{color:#f3f1e8;text-shadow:0 1px 3px #111}
.poster-print{position:absolute;left:32.88%;top:9.38%;width:34.05%;height:69.82%;background:#171918;color:#eef0e6;overflow:hidden;container-type:inline-size}
.poster-art{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;opacity:.85}
.poster-print:after{content:'';position:absolute;inset:0;box-shadow:inset 0 0 10px #0007;background:linear-gradient(180deg,#17191870,transparent 65%,#17191885);pointer-events:none}
.poster-copy{position:absolute;left:10%;top:8%;right:8%;z-index:1}.poster-kicker{font:2cqw/1.5 ProductGeistMono,monospace;letter-spacing:.07em;color:#c2c8bc}
.poster-copy h3{font-size:15cqw;font-weight:400;letter-spacing:-.05em;line-height:.97;margin:7% 0 0}
.poster-signature{position:absolute;left:10%;right:10%;bottom:7%;z-index:1}.poster-signature p{font-size:4.7cqw;color:#d7ddcf;margin:0 0 7%}.poster-signature .kit-logo{--kit-type:7cqw}.poster-signature small:not(.brand-beta){position:absolute;right:0;bottom:3%;font:1.7cqw ProductGeistMono,monospace;letter-spacing:.04em}.poster-signature .brand-beta{font-size:2.1cqw}
@media(max-width:720px){.kit-tile.merchandise{grid-column:span 12}.kit-tile.cap{grid-column:span 12;aspect-ratio:1.3}.kit-tile.cap .garment-photo{object-position:center 55%}.kit-tile.cap .cap-stamp{top:29%}.kit-tile.outdoor{aspect-ratio:3/2}.outdoor .kit-tile-caption{font-size:8px;bottom:10px}.outdoor .kit-tile-label{font-size:7px}}
.outdoor .kit-tile-label{color:#f3f1e8;text-shadow:0 1px 3px #111}

/* Keep complete headline phrases together; avoid isolated closing words. */
#mockup-view h2,#mockup-view h3{text-wrap:balance}
#mockup-view p{text-wrap:pretty}
#mockup-view .mockup-line{display:block;white-space:nowrap}

.screen h2 .mockup-line{display:block;white-space:nowrap}

/* Two city-scale applications; live artwork stays independent of the scene photos. */
.kit-tile.city-media{grid-column:span 12;aspect-ratio:3/2;background:#bbb7ad}
.city-scene{position:absolute;inset:0}.city-photo{display:block;width:100%;height:100%}
.city-media>.kit-tile-label{color:#fff;text-shadow:0 1px 4px #0009}
#kit-outdoor{position:absolute;z-index:5;bottom:16px;left:20px;padding:8px 10px;border:1px solid #fff6;border-radius:6px;background:#f5f5efec;color:#263027;font:11px ProductGeistMono,monospace;cursor:pointer;max-width:70%}
#kit-outdoor:focus-visible{outline:2px solid #52674c;outline-offset:3px}.city-disclaimer{position:absolute;bottom:20px;right:20px;color:#fff;font:9px ProductGeistMono,monospace;text-shadow:0 1px 4px #000}
.billboard-print{position:absolute;left:10.68%;top:13.77%;width:75.71%;height:29.1%;container-type:inline-size;color:#202622;overflow:hidden;mix-blend-mode:multiply}
.billboard-art{position:absolute;right:0;top:0;width:50%;height:100%;max-height:none;aspect-ratio:auto;filter:invert(1);mix-blend-mode:multiply;opacity:.23}
.billboard-print h3{position:absolute;left:5.5%;top:12%;margin:0;font-size:5.65cqw;line-height:.98;font-weight:400;letter-spacing:-.045em;z-index:1}
.billboard-signature{position:absolute;right:5.5%;top:42%;z-index:1}.billboard-signature .kit-logo{--kit-type:4.1cqw}
.billboard-print>small{position:absolute;left:5.5%;bottom:7%;font:1cqw ProductGeistMono,monospace;letter-spacing:.07em}
.city-media .product-lockup{gap:calc(var(--kit-type)*.333);line-height:1}.city-media .product-name{font-size:var(--kit-type);line-height:1}.city-media .product-tile{width:calc(var(--kit-type)*1.167);height:calc(var(--kit-type)*1.167)}
.city-media .brand-beta{font-size:calc(var(--kit-type)*.32)}
.street-display{position:absolute;left:38.93%;top:10.06%;width:22.27%;height:61.43%;container-type:inline-size;color:#eef3e9;background:#171918;overflow:hidden;box-shadow:0 0 8px #e0f0cf20}
.street-art{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;opacity:.85}
.street-display:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(#17191870,transparent 70%,#17191865);box-shadow:inset 0 0 6px #0008}
.street-copy{position:absolute;z-index:1;top:9%;left:9%;right:8%}.street-copy>small{display:block;font:2.3cqw/1.4 ProductGeistMono,monospace;letter-spacing:.06em;color:#c8d3c1}.street-copy h3{font-size:14.7cqw;line-height:.99;letter-spacing:-.045em;font-weight:400;margin:9% 0 0}
.street-signature{position:absolute;z-index:1;bottom:8%;left:9%;right:9%}.street-signature .kit-logo{--kit-type:7.5cqw}.street-signature>small{display:block;font:2cqw ProductGeistMono,monospace;letter-spacing:.08em;margin-top:9%;color:#bdcab4}
@media(max-width:720px){#kit-outdoor{font-size:8px;padding:5px 7px;bottom:12px;left:12px;max-width:65%}.city-disclaimer{display:none}.city-media>.kit-tile-label{font-size:7px;top:10px;left:12px}}

/* Keep the publication notice inside the fixed-height desktop shell. */
@media(min-width:721px){body{display:flex;flex-direction:column;height:100dvh}.publication-note{flex:none}.workspace,body.isolated .workspace{flex:1;min-height:0;height:auto}.isolated .workspace>#brand-screen{height:100%;min-height:0}}
