/* Shared identity across the studio, product, maker and learning templates. */
@font-face{font-family:Bricolage;src:url('/fonts/bricolage-grotesque-latin-standard-normal.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:Manrope;src:url('/fonts/manrope-latin-wght-normal.woff2') format('woff2');font-weight:200 800;font-display:swap}
@font-face{font-family:Caveat;src:url('/fonts/caveat-latin-600-normal.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--gold:#FFBA08;--sans:Manrope,Arial,sans-serif;--heading:Bricolage,Arial,sans-serif;--serif:Caveat,cursive;--ring-rgb:255 186 8}
[data-site-area=make],[data-accent-area=make]{--gold:#39B54A;--ring-rgb:57 181 74}
[data-site-area=learn],[data-accent-area=learn]{--gold:#5271FF;--ring-rgb:82 113 255}
body{font-family:var(--sans)}
h1,h2,h3{font-family:var(--heading)}
h1 em,h2 em,h3 em,.handwritten{font-family:Caveat,cursive;font-style:normal;font-weight:600}
.nav-logo,.studio-logo,.footer-logo{display:block;flex-shrink:0;line-height:1;text-decoration:none!important}
.brand-logo{position:relative;display:block;width:140px;height:58px;overflow:hidden}
.brand-logo img{position:absolute;display:block;max-width:none!important;width:170.45px!important;height:95.88px!important;left:-16.87px;top:-15.71px;object-fit:fill!important}
/* Navigation always uses the studio's gold, with a single underline. */
.main-nav>a,.nav-links>li>a:not(.nav-cta):not(.lang-switch),.nav-prod-links>a:not(.nav-back):not(.lang-switch),.studio-header nav>a{position:relative;font-family:Manrope,Arial,sans-serif!important;font-weight:500;letter-spacing:0;text-transform:none;text-decoration:none!important;padding-top:8px;padding-bottom:8px}
.main-nav>a::after,.nav-links>li>a:not(.nav-cta):not(.lang-switch)::after,.nav-prod-links>a:not(.nav-back):not(.lang-switch)::after,.studio-header nav>a::after{content:'';position:absolute;left:0;bottom:3px;width:100%;height:2px;background:#FFBA08;transform:scaleX(0);transform-origin:left;transition:transform .22s ease}
.main-nav>a:hover::after,.main-nav>a:focus-visible::after,.main-nav>a[aria-current]::after,.nav-links>li>a:hover::after,.nav-links>li>a:focus-visible::after,.nav-prod-links>a:hover::after,.nav-prod-links>a:focus-visible::after,.studio-header nav>a:hover::after,.studio-header nav>a:focus-visible::after{transform:scaleX(1)}
.main-nav>a:hover,.nav-links a:hover,.nav-prod-links a:hover{color:var(--ink)}
.nav-order,.nav-cta,.nav-back,.btn,.btn-gold,.btn-dark,.btn-outline{font-family:var(--heading);border-radius:999px;transition:background .2s,color .2s,transform .2s,box-shadow .2s}
.nav-order:hover,.nav-cta:hover,.nav-back:hover,.btn:hover,.btn-gold:hover,.btn-dark:hover,.btn-outline:hover{background:var(--gold);color:#111;box-shadow:0 5px 0 #111;transform:translateY(-3px)}
.path-label{display:block;font:600 48px/1.1 Caveat,cursive;color:var(--gold);margin-top:16px}
.image-path h3{margin-top:8px}
.ttc-cart-btn,.ttc-cart-checkout{background:var(--gold)!important}.ttc-cart-badge{color:var(--gold)!important}
[data-site-area=shop] .hero-h1,[data-site-area=learn] .lh-h1{font-family:var(--heading);font-weight:500}
[data-site-area=shop] .hero-h1 em,[data-site-area=learn] .lh-h1 em{font-family:Caveat,cursive;font-style:normal;font-weight:600}
@keyframes brand-arrow-bounce{from{transform:translate(0,0)}to{transform:translate(2px,-2px)}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.btn:hover>.button-arrow,.btn-gold:hover>.button-arrow,.nav-order:hover>.button-arrow,.nav-cta:hover>.button-arrow{animation:brand-arrow-bounce 550ms cubic-bezier(.45,0,.55,1) infinite alternate}}
@media(max-width:760px){.nav-logo .brand-logo,.studio-logo .brand-logo,.footer-logo .brand-logo{width:112px;height:46.4px}.nav-logo .brand-logo img,.studio-logo .brand-logo img,.footer-logo .brand-logo img{width:136.36px!important;height:76.7px!important;left:-13.5px;top:-12.57px}.path-label{font-size:42px}}
@media(prefers-reduced-motion:reduce){.main-nav>a::after,.nav-links a::after,.nav-prod-links a::after,.studio-header nav>a::after{transition:none}.btn,.btn-gold,.nav-order,.nav-cta,.nav-back{transition:none}.button-arrow{animation:none!important}}
/* Keep legacy decorative bleeds inside the viewport; carousels still scroll. */
html{overflow-x:clip}
.nav-order,.nav-cta,.nav-back{font-size:14px;font-weight:500;letter-spacing:0;text-transform:none}
.hero-img-frame,.prod-img-main{border-radius:26px}

[data-site-area=make] .page-intro h1 em,[data-site-area=make] .tool-intro h1 em,[data-site-area=learn] h1 em{color:var(--gold)}
[data-site-area=make] .tabs button[aria-pressed=true]{background:var(--gold);border-color:var(--gold);color:#111}

/* One logo crop, including mobile wordmarks. */
.wordmark .brand-logo{width:140px;height:58px}
.wordmark .brand-logo img{width:170.45px!important;height:95.88px!important;left:-16.87px;top:-15.71px}
@media(max-width:760px){.wordmark .brand-logo{width:112px;height:46.4px}.wordmark .brand-logo img{width:136.36px!important;height:76.7px!important;left:-13.5px;top:-12.57px}}
[data-site-area=make] .button[data-added=true]{background:#39B54A;color:#111;border-color:#111}
.model-card .button:disabled{opacity:.55;cursor:not-allowed;box-shadow:none;transform:none}
/* Product names and instructions stay in readable sans-serif type. */
[data-site-area=shop] .prod-name{font-family:var(--heading);font-weight:500;font-style:normal}
[data-site-area=shop] .prod-dims h4,[data-site-area=shop] .prod-section h4{font-family:var(--sans)}
[data-site-area=make] .small a,[data-site-area=make] .download-note a{color:#216B2B}
[data-site-area=learn] .lh-bullets{color:#263DAD}
[data-site-area=learn] .lh-hero>*{min-width:0}
[data-site-area=learn] .lh-ctas{flex-wrap:wrap}
[data-site-area=learn] .lh-ctas .btn{max-width:100%;white-space:normal;text-align:center;min-height:44px}
/* Caveat's letterforms sit lower than Bricolage at the same nominal size.
   Match their perceived size while keeping each heading's responsive scale. */
h1 em,h2 em,h3 em,.hero-h1 em,.lh-h1 em,.lh-h2 em{font-size:1.22em!important;line-height:.95}
.studio-hero h1 em{font-size:1.08em!important}
/* Shared sticky headers, larger navigation, and handwritten accents. */
body{overflow-x:clip!important}
.masthead,.studio-header,body>nav{position:sticky!important;top:0!important;z-index:300!important;background:#fff!important}
.masthead{max-width:none;padding-left:4%;padding-right:4%}
.main-nav,.nav-links,.nav-prod-links{font-size:17px!important}
.main-nav>a,.nav-links>li>a,.nav-prod-links>a,.shop-menu [data-slot=navigation-menu-trigger]{font-size:17px!important}
body [data-handwriting][data-handwriting]{font-size:calc(var(--handwriting-size)*1.15)!important;color:var(--gold)!important}
.studio-menu-toggle{display:none}
.unified-site-footer{padding:48px 5%!important;margin:0 auto;background:#fff!important;border-top:1px solid var(--line);color:var(--ink)}
.site-footer-inner{max-width:1420px;margin:auto;display:flex;align-items:center;justify-content:space-between;gap:35px}
.site-footer-menu{display:flex;flex-wrap:wrap;gap:18px 26px;align-items:center;font:500 16px/1.5 var(--sans);position:static!important;background:none!important;padding:0!important;border:0!important}
.site-footer-menu a:hover{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--gold)}
.unified-site-footer .footer-biz{margin-top:28px}
.image-paths{align-items:stretch!important;gap:24px!important}
.image-path{border:1px solid var(--line);border-radius:26px;padding:16px!important;margin:0!important;display:flex;flex-direction:column;background:#fff;min-width:0;transition:transform .3s ease,box-shadow .3s ease}
.image-path .path-image{flex-shrink:0}
.image-path .path-cta{align-self:flex-start;margin-top:auto}
.image-path h3{margin-bottom:24px}
.image-path:hover{transform:translateY(-5px);box-shadow:0 14px 32px #0000000c}
.image-path .path-image{aspect-ratio:1.15!important;border-radius:18px}
.image-path p{margin-bottom:10px}.image-path .path-label{margin-top:20px}
@keyframes menu-pill-pop{from{opacity:0;transform:translateY(-12px) scale(.86)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:1100px){.main-nav,.nav-links,.nav-prod-links{gap:12px!important}.main-nav>a,.nav-links>li>a,.nav-prod-links>a,.shop-menu [data-slot=navigation-menu-trigger]{font-size:16px!important}}
@media(max-width:1100px){
 .masthead{display:flex;flex-wrap:nowrap!important;gap:10px;padding:14px 4%!important;align-items:center}
 .masthead .utility{margin-left:auto;gap:10px}.masthead .utility>a:first-child{display:none}
 .masthead .utility .pill{font-size:12px;padding:11px 14px}
 .studio-menu-toggle,.nav-burger,.nav-prod-burger{display:flex!important;flex-direction:column;justify-content:center;align-items:center;gap:5px;position:relative;width:44px;height:44px;border:1px solid var(--line)!important;border-radius:999px;background:white!important;padding:10px!important;flex-shrink:0;cursor:pointer}
 .studio-menu-toggle span,.nav-burger span,.nav-prod-burger span{display:block!important;width:21px!important;height:2px!important;background:#111!important;transition:transform .25s ease,opacity .2s ease}
 .studio-menu-toggle[aria-expanded=true] span:nth-child(1),.nav-burger[aria-expanded=true] span:nth-child(1),.nav-prod-burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .studio-menu-toggle[aria-expanded=true] span:nth-child(2),.nav-burger[aria-expanded=true] span:nth-child(2),.nav-prod-burger[aria-expanded=true] span:nth-child(2){opacity:0}
 .studio-menu-toggle[aria-expanded=true] span:nth-child(3),.nav-burger[aria-expanded=true] span:nth-child(3),.nav-prod-burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 #studioNav,#navLinks,#navProdLinks{display:none!important;position:absolute!important;top:calc(100% + 12px)!important;left:auto!important;right:4%!important;width:min(360px,92vw)!important;max-height:calc(100dvh - 110px);overflow:auto;padding:12px!important;margin:0!important;background:#fff!important;border:1px solid var(--line);border-radius:28px!important;box-shadow:0 20px 60px #0002;flex-direction:column!important;gap:10px!important;z-index:302}
 #studioNav.open,#navLinks.open,#navProdLinks.open{display:flex!important}
 #studioNav>a,#studioNav>[data-shop-menu],#navLinks>li,#navLinks>a,#navProdLinks>a,#navProdLinks>.nav-region{display:block;width:100%;margin:0;border:0;padding:0}
 #studioNav>a,#navLinks>li>a,#navLinks>a,#navProdLinks>a{display:flex;justify-content:center;align-items:center;border:1px solid var(--line);border-radius:999px;padding:14px 20px!important;font:500 22px/1.2 var(--sans)!important;text-transform:none;letter-spacing:0;min-height:52px}
 #studioNav [data-slot=navigation-menu-trigger],#navLinks [data-slot=navigation-menu-trigger]{font-size:22px!important;justify-content:center;width:100%;padding:14px 20px;border:1px solid var(--line);border-radius:999px}
 #studioNav .shop-menu,#studioNav [data-slot=navigation-menu-list],#studioNav [data-slot=navigation-menu-item],#navLinks .shop-menu,#navLinks [data-slot=navigation-menu-list],#navLinks [data-slot=navigation-menu-item]{width:100%}
 #studioNav .shop-menu-content,#navLinks .shop-menu-content{position:static;min-width:0;margin-top:8px;border-radius:26px}
 #studioNav.open:not(.ttc-closing)>*,#navLinks.open:not(.ttc-closing)>*,#navProdLinks.open:not(.ttc-closing)>*{animation:menu-pill-pop .42s cubic-bezier(.2,1.35,.35,1) both;animation-delay:calc(var(--menu-index,0)*45ms)}
 #studioNav>*:nth-child(2),#navLinks>*:nth-child(2),#navProdLinks>*:nth-child(2){--menu-index:1}
 #studioNav>*:nth-child(3),#navLinks>*:nth-child(3),#navProdLinks>*:nth-child(3){--menu-index:2}
 #studioNav>*:nth-child(4),#navLinks>*:nth-child(4),#navProdLinks>*:nth-child(4){--menu-index:3}
 #studioNav>*:nth-child(5),#navLinks>*:nth-child(5),#navProdLinks>*:nth-child(5){--menu-index:4}
 #studioNav>*:nth-child(6),#navLinks>*:nth-child(6),#navProdLinks>*:nth-child(6){--menu-index:5}
 #studioNav>*:nth-child(7),#navLinks>*:nth-child(7),#navProdLinks>*:nth-child(7){--menu-index:6}
 .site-footer-inner{flex-direction:column;align-items:flex-start}.site-footer-menu{gap:18px 24px;font-size:17px}
 .nav-order{margin-left:auto}
}
@media(max-width:380px){.masthead .brand-logo{width:92px;height:38px}.masthead .brand-logo img{transform:scale(.82);transform-origin:top left}.masthead .utility .pill{font-size:11px;padding:10px}.masthead{gap:6px}}
@media(prefers-reduced-motion:reduce){#studioNav.open>*,#navLinks.open>*,#navProdLinks.open>*{animation:none!important}.studio-menu-toggle span,.nav-burger span,.nav-prod-burger span,.image-path{transition:none}}
/* Studio header structure also applies to workshop and tool templates. */
.masthead{display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}
.masthead .main-nav{display:flex;align-items:center;gap:26px}
.masthead .utility{display:flex;align-items:center;gap:16px;font:500 14px/1.3 var(--sans)}
.masthead .pill{display:inline-flex;align-items:center;justify-content:center;background:#111;color:#fff;border:1px solid #111;border-radius:999px;padding:12px 18px;font:500 14px/1.3 var(--sans);text-decoration:none}
@media(max-width:1100px){.masthead{gap:10px}.masthead .utility{gap:10px}.masthead .pill{font-size:12px;padding:11px 14px}}
@media(max-width:380px){.masthead{gap:6px}.masthead .utility .pill{max-width:100px;font-size:11px;padding:8px 10px;white-space:normal;text-align:center}}
.product-line,.nav-links a.product-line{font-size:17px!important}
:target{scroll-margin-top:110px}
@media(max-width:1100px){.product-line,.nav-links a.product-line{font-size:18px!important}}
/* A shared control height keeps the cart circular alongside the header pills. */
body{--header-control-size:44px}
.ttc-cart-btn{position:relative;width:var(--header-control-size)!important;height:var(--header-control-size)!important;min-width:var(--header-control-size);padding:4px!important;justify-content:center;box-sizing:border-box}
.ttc-cart-ico{width:100%!important;height:100%!important}
.ttc-cart-badge{position:absolute;top:-7px;right:-8px;min-width:20px!important;height:20px!important;line-height:20px!important;padding:0 5px!important;font-size:10px!important;margin:0!important}
.masthead .utility .pill{height:var(--header-control-size);box-sizing:border-box}
.destination-icon{width:20px;height:20px;flex-shrink:0;vertical-align:middle}
.main-nav>a,.nav-links>li>a,.nav-prod-links>a{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
@media(max-width:1280px) and (min-width:1101px){.masthead{gap:14px}.masthead .main-nav{gap:12px}.masthead .utility{gap:10px}.masthead .utility>a:first-child{display:none}.nav-links,.nav-prod-links{gap:8px!important}.nav-links>li>a,.nav-prod-links>a{font-size:14px!important;gap:5px}.destination-icon{width:17px;height:17px}}
@media(max-width:1100px){
 .masthead>.wordmark,.masthead>.utility,.masthead>.studio-menu-toggle,body>nav>.nav-logo,body>nav>.nav-order,body>nav>.ttc-nav-right,body>nav>.nav-burger{position:relative;z-index:304}
 #studioNav,#navLinks,#navProdLinks{top:100%!important;left:0!important;right:0!important;width:100%!important;padding:18px 5% 28px!important;border:0!important;border-radius:0 0 28px 28px!important;box-shadow:0 18px 30px #00000012;gap:4px!important;overscroll-behavior:contain;transform-origin:top}
 #studioNav.open:not(.ttc-closing)>*,#navLinks.open:not(.ttc-closing)>*,#navProdLinks.open:not(.ttc-closing)>*{animation:none!important}
 #studioNav>a,#navLinks>li>a,#navLinks>a,#navProdLinks>a,#studioNav [data-slot=navigation-menu-trigger],#navLinks [data-slot=navigation-menu-trigger]{justify-content:flex-start!important;border:0!important;border-radius:12px!important;padding:14px 16px!important;gap:14px!important;background:transparent;min-height:56px}
 #studioNav>a:hover,#navLinks>li>a:hover,#navProdLinks>a:hover{background:rgb(var(--ring-rgb) / .12)}
 #studioNav .destination-icon,#navLinks .destination-icon,#navProdLinks .destination-icon{width:24px;height:24px}
 #studioNav::after,#navLinks::after,#navProdLinks::after{content:'';display:block;align-self:center;width:36px;height:4px;min-height:4px;border-radius:99px;background:#1113;margin:16px auto -14px}
 body[data-site-area=shop] .hero-section .hero-h1 em,body[data-site-area=shop] .hero-section .hero-h1 [data-handwriting]{color:#1c1b18!important}
}
@media(max-width:1100px){
 .nav-logo,.nav-right>.ttc-cart-btn,.nav-burger,.nav-prod-burger{position:relative;z-index:304}
 .masthead .utility .pill{text-align:center}
 #studioNav>a::after,#navLinks>li>a::after,#navProdLinks>a::after{display:none}
}
@media(max-width:380px){.masthead .utility{gap:6px}.masthead .utility .pill{max-width:88px}}

.skip{position:absolute;left:20px;top:-80px;background:white;padding:12px;z-index:400}.skip:focus{top:10px}
@media(max-width:1100px){#studioNav>a,#navLinks>li>a,#navLinks>a,#navProdLinks>a{color:#111!important}.nav-cta,.nav-order{height:44px;box-sizing:border-box}}
/* Ink outlines with destination-specific color, like a sketchbook annotation. */
.handdrawn-icon .icon-color{fill:var(--icon-accent);stroke:none}
.handdrawn-icon-host{display:inline-flex;align-items:center;flex-shrink:0}
.destination-icon.handdrawn-icon{width:24px;height:24px;overflow:visible}
@media(max-width:1100px){#studioNav .handdrawn-icon,#navLinks .handdrawn-icon,#navProdLinks .handdrawn-icon{width:28px;height:28px}}
/* The shop stays upright; its illustrated double doors welcome visitors in. */
.shop-door{transform-box:fill-box;transition:transform .38s cubic-bezier(.22,1,.36,1)}
.shop-door-left{transform-origin:left center}.shop-door-right{transform-origin:right center}
[data-slot=navigation-menu-trigger][data-state=open] .shop-door-left,.image-path:hover .shop-door-left{transform:scaleX(.18) skewY(-12deg)}
[data-slot=navigation-menu-trigger][data-state=open] .shop-door-right,.image-path:hover .shop-door-right{transform:scaleX(.18) skewY(12deg)}
#studioNav .shop-menu-content,#navLinks .shop-menu-content,.shop-menu-content{border-radius:999px!important}
.path-label{display:flex;align-items:center;gap:12px}
.path-label .handdrawn-icon{width:42px;height:42px}
.site-footer-inner{align-items:flex-start;padding-bottom:32px}
.site-footer-menu{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:12px 44px}
.site-footer-menu a{padding:6px 0}
.site-footer-bottom{max-width:1420px;margin:auto;padding-top:24px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:20px;font:400 13px/1.6 var(--sans);color:#595954}
.site-footer-bottom p{margin:0}.footer-legal{display:flex;gap:24px;position:static;background:none;padding:0;border:0}.footer-legal a:hover{text-decoration:underline}
@media(max-width:600px){.site-footer-inner{gap:28px}.site-footer-menu{width:100%;grid-template-columns:1fr 1fr;gap:10px 24px}.site-footer-bottom{flex-direction:column;align-items:flex-start;gap:14px}.footer-legal{font-size:14px}.studio-outro h2{font-size:clamp(36px,9vw,52px)}}
@media(prefers-reduced-motion:reduce){.shop-door{transition:none}}
/* Homepage title lines, and photographs framed around their subjects. */
.studio-hero h1{font-size:clamp(30px,3.7vw,54px);letter-spacing:-1.5px;line-height:1.12}
.hero-title-line{display:block;white-space:nowrap}.studio-hero h1 em{display:inline!important;margin:0;letter-spacing:-2px}
.studio-home .studio-intro{display:block}
.studio-home .studio-intro h2{font-size:clamp(18px,4.3vw,58px);letter-spacing:-.03em;white-space:nowrap;margin-bottom:0}
.founder-feature img,.founder-photo img{width:100%;height:auto!important;min-height:0;max-height:none;aspect-ratio:1;object-fit:cover}
.workshop-feature img{object-position:50% 20%}
.workshop-feature h2 em{display:inline-block}
.image-path{display:flex;flex-direction:column;border:2px solid #111;box-shadow:7px 7px 0 #111;transition:transform .25s ease,box-shadow .25s ease}
.image-path:hover{transform:translate(-2px,-2px);box-shadow:10px 10px 0 #111}
.image-path:active{transform:translate(4px,4px);box-shadow:3px 3px 0 #111}
.studio-outro{border-top:0}.unified-site-footer{border-top:0!important}
.site-footer-menu a{display:flex;align-items:center;gap:10px}.site-footer-menu .handdrawn-icon{flex-shrink:0}
.site-footer-bottom{border-top:0;padding-top:14px}
.page-intro:has(+.founder-intro){padding-bottom:8px}.founder-intro{padding-top:24px}
.idea-photo-pair{display:flex;overflow-x:auto;gap:20px;scroll-snap-type:x mandatory;padding-bottom:14px}
.idea-photo-pair figure{flex:0 0 calc(50% - 10px);margin:0!important;scroll-snap-align:start}
.idea-photo-pair img{width:100%;height:auto;aspect-ratio:1;object-fit:cover}
[data-site-area=learn] .lh-h2{font-family:var(--heading);font-weight:500}
[data-site-area=learn] .lh-h2 em{font-family:Caveat,cursive;font-weight:600;font-style:normal}
[data-site-area=learn] .lh-ctas .btn,[data-site-area=learn] .wl-submit{white-space:nowrap;flex-shrink:0}
@media(max-width:760px){
 .studio-hero h1{font-size:clamp(28px,7.8vw,56px);letter-spacing:-1px}
 .hero-photo{height:auto;min-height:0;aspect-ratio:1}.hero-photo>img{width:100%;height:100%;min-height:0;max-height:none;aspect-ratio:1}
 .idea-photo-pair figure{flex-basis:calc(82% - 10px)}
 .image-paths{padding-right:7px;gap:25px}
 [data-site-area=learn] .lh-ctas .btn{font-size:13px;padding:13px 18px;gap:8px}
 .tm-reviews .rv-text{font-size:13px;line-height:1.5}
 .tm-reviews .rv-meta{font-size:12px;margin-bottom:8px}
}
@media(prefers-reduced-motion:reduce){.image-path{transition:none}}
.workshop-feature h2 em{font-size:.68em!important;line-height:1.1}
.make-route-card{border:2px solid #111;border-radius:26px;padding:16px;box-shadow:7px 7px 0 #111;align-items:stretch}
.make-route-card .make-preview{border-radius:18px;aspect-ratio:1.15;height:auto;min-height:0;margin:0 0 22px;object-fit:cover}
.make-route-card h2{margin:0 0 14px;font-size:32px}.make-route-card .button{align-self:flex-start}.make-route-card .tabs{margin-top:0}
.license-options{position:relative;gap:0;border:1px solid var(--line);border-radius:26px;overflow:visible}
.license-options article{border:0;border-radius:0;padding:30px}.license-options article:last-child{border-left:1px solid var(--line)}
.license-options .button{margin-top:20px}
.license-or{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid var(--line);border-radius:50%;width:44px;height:44px;display:grid;place-items:center;background:white;font:600 12px var(--sans);z-index:1}
#library-grid{grid-template-columns:1fr}
#library-grid .model-card{display:grid;grid-template-columns:minmax(140px,28%) minmax(0,1fr);gap:24px;align-items:start;border-radius:26px;padding:16px}
#library-grid .card-visual{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:18px;margin:0}
#library-grid .details{padding:0;text-align:left}#library-grid h3{text-align:left;margin-top:12px}
.print-notes .text-link{display:inline-flex;align-items:center;gap:8px}
.ttc-license-section{padding:16px 0}.ttc-license-section h3{margin:0 0 8px}.ttc-license-section>p{font-size:13px;line-height:1.5}.ttc-license-total{display:flex;justify-content:space-between}
.ttc-license-checkout{display:block;padding:14px 18px;border-radius:999px;background:#39B54A;color:#111;text-align:center;font-weight:600;text-decoration:none}
.ttc-cart-foot[hidden]{display:none!important}
@media(max-width:760px){.license-options{grid-template-columns:1fr}.license-options article{padding:26px}.license-options article:last-child{border-left:0;border-top:1px solid var(--line);padding-top:36px}.license-or{top:auto;left:50%;position:relative;transform:none;margin:-22px 0 -22px -22px}.make-route-card{margin-right:7px}#library-grid .model-card{grid-template-columns:110px minmax(0,1fr);gap:14px;padding:14px}#library-grid .details h3{font-size:23px}#library-grid .details .button{padding:12px 10px;font-size:13px}#library-grid .price-row{flex-wrap:wrap;gap:6px}#library-grid .badge{font-size:9px}}
/* Shared controls retain their native form semantics with a distinct component UI. */
.studio-select-source{position:absolute!important;width:1px!important;height:1px!important;clip-path:inset(50%)!important;overflow:hidden!important;opacity:0!important;padding:0!important;border:0!important;pointer-events:none!important}
[data-studio-select]{display:block;min-width:0;width:100%}[data-studio-select][hidden]{display:none}
.studio-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;min-height:44px;padding:11px 14px;border:1.5px solid #b7b7b1;border-radius:12px;background:#fff;color:#1c1b18;font:500 14px/1.4 var(--sans);text-align:left;cursor:pointer}
.studio-select-trigger:focus-visible{outline:3px solid var(--gold);outline-offset:3px}.studio-select-trigger:disabled{opacity:.5;cursor:not-allowed}
.studio-select-content{z-index:12000;max-height:min(320px,var(--radix-select-content-available-height));width:var(--radix-select-trigger-width);min-width:160px;overflow:auto;background:white;color:#111;border:1px solid #ccc;border-radius:14px;padding:6px;box-shadow:0 12px 36px #0002;font:500 14px/1.4 var(--sans)}
.studio-select-item{display:flex;align-items:center;justify-content:space-between;gap:12px;outline:none;cursor:pointer;padding:11px 12px;border-radius:9px}.studio-select-item[data-highlighted]{background:#f0f0ec}.studio-select-item[data-state=checked]{background:#fff0ba}.studio-select-item[data-disabled]{opacity:.4;pointer-events:none}
input[type=radio],input[type=checkbox]{appearance:none!important;-webkit-appearance:none!important;display:inline-grid;place-content:center;vertical-align:middle;width:20px!important;height:20px!important;min-width:20px;flex-shrink:0;border:1.5px solid #92928c!important;background:#fff;border-radius:5px;cursor:pointer;margin-right:7px;padding:0!important}
input[type=radio]{border-radius:50%}input[type=radio]:checked,input[type=checkbox]:checked{border-color:#111!important;background:var(--gold,#ffba08)}
input[type=radio]:checked:after{content:'';width:8px;height:8px;border-radius:50%;background:#111}input[type=checkbox]:checked:after{content:'';width:9px;height:5px;border-left:2px solid #111;border-bottom:2px solid #111;transform:rotate(-45deg) translateY(-1px)}
input[type=radio]:focus-visible,input[type=checkbox]:focus-visible{outline:3px solid var(--gold);outline-offset:3px}input:disabled{cursor:not-allowed}
.cfg-box{border:1.5px solid #b9b9b3!important;border-radius:20px!important;background:#fff;margin:0!important;width:100%!important;overflow:hidden}
.icon-select{display:flex;flex-wrap:wrap;gap:8px;padding:12px;border:1px solid #d3d3cc;border-radius:16px;background:#fafaf8}
.icon-select .icon-opt{border:1.5px solid #b9b9b3;border-radius:10px;background:#fff;padding:10px 12px;min-height:40px;cursor:pointer}
.icon-select .icon-opt.selected,.icon-select .icon-opt.active{border-color:#111;background:var(--gold);box-shadow:2px 2px 0 #111}
.faq-section .s-h{font-family:var(--heading);font-weight:500}.faq-section .s-h em{font-family:Caveat,cursive;font-style:normal;font-weight:600}
.product-wrap--customise{padding-bottom:24px}.product-wrap--customise+.faq-section{padding-top:28px;padding-bottom:48px}.faq-section .faq-list{margin-top:24px}
@media(max-width:820px){.product-wrap--customise{padding-bottom:20px}.product-wrap--customise+.faq-section{padding-top:24px}.cfg-box{margin:0!important;width:100%!important}}
/* One header scale across studio and shop; the accent identifies the page. */
.masthead,.studio-header,body>nav{height:80px!important;min-height:80px!important;padding:12px 4%!important;box-sizing:border-box;background:var(--gold)!important;isolation:isolate}
.masthead .brand-logo,.studio-header .brand-logo,body>nav .brand-logo{width:98px!important;height:41px!important;overflow:hidden;position:relative;display:block}
.masthead .brand-logo img,.studio-header .brand-logo img,body>nav .brand-logo img{width:119.32px!important;height:67.12px!important;left:-11.81px!important;top:-11px!important;transform:none!important;max-width:none!important}
.masthead::before,.studio-header::before,body>nav::before{content:'';position:absolute;inset:0;background:var(--gold);z-index:303;pointer-events:none}
.masthead>*:not(.main-nav),.studio-header>*:not(nav),body>nav>*:not(.nav-links):not(.nav-prod-links){position:relative;z-index:304}
.masthead .main-nav{z-index:304}
@media(max-width:1100px){
 .masthead,.studio-header,body>nav{height:76px!important;min-height:76px!important;padding:12px 5%!important}
 #studioNav,#navLinks,#navProdLinks{height:auto!important;min-height:0!important;max-height:calc(100dvh - 88px)!important;overflow-y:auto!important;overflow-x:hidden!important;flex:initial!important;z-index:302!important;box-sizing:border-box;top:100%!important}
 #studioNav>*,#navLinks>*,#navProdLinks>*{flex-shrink:0!important}
 .masthead .main-nav{z-index:302}
}
.ideas-underline{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:10px}
/* Closely stepped shadows form a continuous extrusion, including curved corners. */
.image-path,.make-route-card,#library-grid .model-card{border:2px solid #111;border-radius:26px;box-shadow:1px 2px 0 #111,2px 4px 0 #111,3px 6px 0 #111,4px 8px 0 #111,5px 10px 0 #111,6px 12px 0 #111;transform:none}
.image-path:hover,.make-route-card:hover,#library-grid .model-card:hover{transform:translateY(-3px);box-shadow:1px 2px 0 #111,2px 4px 0 #111,3px 6px 0 #111,4px 8px 0 #111,5px 10px 0 #111,6px 12px 0 #111,7px 14px 0 #111}
.library-search-row{border-top:1px solid var(--line);padding:24px 0 32px}.library-search-row .search{width:100%;max-width:none;box-sizing:border-box}
#library-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:32px 24px;padding:0 8px 12px 0}
#library-grid .model-card{display:flex;flex-direction:column;padding:12px;gap:16px;min-width:0;background:#fff}
#library-grid .model-card .card-visual{width:100%;height:auto;aspect-ratio:1;object-fit:cover;border-radius:16px;margin:0}
#library-grid .details{display:flex;flex:1;flex-direction:column;padding:0 4px 6px;gap:12px;min-width:0}
#library-grid .details h3{font-size:25px;line-height:1.15;margin:0}#library-grid .details .small{font-size:14px;line-height:1.5;margin:0}
#library-grid .details .button{font-size:14px;white-space:nowrap;padding:12px 8px;margin-top:auto;gap:6px}
#library-grid .print-notes{font-size:12px;margin:0}#library-grid .print-notes summary{font-size:12px}
/* An open print-notes panel sizes its own card only; neighbours keep their natural height instead of stretching to match. */
#library-grid:has(.print-notes[open]) .model-card{align-self:start}
#library-grid .details .small{min-height:3em}
/* Coming soon: no action, muted artwork and no hover lift. */
#library-grid .model-card{position:relative}#library-grid .details .badge{position:absolute;top:24px;left:24px;margin:0;font-size:10px;font-weight:700;background:#111;color:#fff;border-radius:999px;padding:5px 10px}
#library-grid .details .badge.is-free{background:var(--gold,#ffba08);color:#111}
@media(max-width:760px){#library-grid .details .badge{top:16px;left:16px}}
#library-grid .is-coming-soon>.card-visual{filter:grayscale(.7);opacity:.7}
#library-grid .is-coming-soon:hover{transform:none;box-shadow:1px 2px 0 #111,2px 4px 0 #111,3px 6px 0 #111,4px 8px 0 #111,5px 10px 0 #111,6px 12px 0 #111}
@media(max-width:1050px){#library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){#library-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}#library-grid .model-card{padding:8px;gap:12px;border-radius:20px}#library-grid .details{padding:0 2px 4px}#library-grid .details h3{font-size:21px}#library-grid .details .small{font-size:12px;min-height:4.5em}#library-grid .details .button{font-size:12px}#library-grid .model-card .card-visual{border-radius:12px}}
@media(prefers-reduced-motion:reduce){.image-path:hover,.make-route-card:hover,#library-grid .model-card:hover{transform:none}}
.pcard,.hl-card{border-radius:26px!important;border:2px solid #111!important}
@media(hover:hover){.pcard:hover,.hl-card:hover{transform:translate(-2px,-3px)!important;box-shadow:1px 2px 0 #111,2px 4px 0 #111,3px 6px 0 #111,4px 8px 0 #111,5px 10px 0 #111,6px 12px 0 #111!important}}

@media(max-width:1100px){.masthead .brand-logo,.studio-header .brand-logo,body>nav .brand-logo{width:78.4px!important;height:32.8px!important}.masthead .brand-logo img,.studio-header .brand-logo img,body>nav .brand-logo img{width:95.456px!important;height:53.696px!important;left:-9.448px!important;top:-8.8px!important}}
.shop-menu-content:has(.product-lines>li:nth-child(2)){border-radius:28px!important}
body>nav .nav-logo .brand-logo img{width:119.32px!important;height:67.12px!important}
@media(max-width:1100px){body>nav .nav-logo .brand-logo img{width:95.456px!important;height:53.696px!important}body>nav>.nav-right,body>nav>.ttc-nav-right{position:static!important;z-index:auto!important}}
@media(max-width:1100px){body>nav>.nav-inner{position:static!important;z-index:auto!important}}

/* Keep the wordmark visible when the optional PNG is absent. */
.brand-logo.brand-logo-fallback{color:#111;font:800 26px/.78 var(--heading);letter-spacing:-1.2px;text-align:left;text-transform:none;text-decoration:none;padding-top:1px}
@media(max-width:1100px){.masthead .brand-logo.brand-logo-fallback,.studio-header .brand-logo.brand-logo-fallback,body>nav .brand-logo.brand-logo-fallback{font-size:21px}}
/* Library toolbar, shared notes and empty state. */
.library-search-row{display:grid;gap:8px}.library-search-label{font-family:var(--heading);font-weight:600;font-size:var(--text-small)}.library-search-row .search{min-height:var(--control-height)}
.library-includes{margin:0 0 var(--space-section)}.library-includes h2{margin:0 0 16px}.library-includes dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px 24px;margin:0}.library-includes dt{font-family:var(--heading);font-weight:600;margin-bottom:4px}.library-includes dd{margin:0;font-size:var(--text-small);color:var(--muted)}
.card-media{display:block;border-radius:16px}
.library-empty{grid-column:1/-1;display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding:32px 0}.library-empty h3{font-family:var(--heading);font-size:25px;margin:0}.library-empty p{margin:0;color:var(--muted)}.library-suggestions{display:flex;flex-wrap:wrap;gap:8px}.library-suggestions .pill{min-height:var(--control-height)}
@media(max-width:1050px){.library-includes dl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:520px){.library-includes dl{grid-template-columns:1fr}.library-includes{padding:20px}}
.library-includes+.library-search-row{border-top:0;padding-top:0}
@media(max-width:760px){#library-grid .details .button{white-space:normal;line-height:1.2;text-align:center}}
/* Reviews as a board: lanes of whole cards on desktop (no scrolling inside a review), one swipe row on a phone. */
.tm-reviews,.lh-tm-grid.has-video .tm-reviews{columns:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start;height:auto;overflow:visible;margin:0;padding:0;min-width:0}
.lh-tm-grid.has-video .tm-reviews{grid-template-columns:repeat(2,minmax(0,1fr))}
.rv-lane{display:flex;flex-direction:column;gap:12px;min-width:0;padding:10px;border-radius:22px;background:rgb(28 27 24 / .04)}
.tm-reviews .rv-card{width:auto;max-width:none;max-height:none;margin:0;padding:18px;overflow:visible;box-sizing:border-box}
.tm-reviews.is-collapsed .rv-lane>.rv-card:nth-child(n+3){display:none}
.review-more{display:flex;justify-content:center;margin-top:20px}.review-more .rv-more{border:1px solid #111;border-radius:999px;background:#fff;color:#111;min-height:44px;padding:10px 22px;font:600 14px/1.2 var(--sans);cursor:pointer}.review-more .rv-more:hover{background:var(--gold)}
@media(max-width:1050px) and (min-width:761px){.tm-reviews{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* A phone reads one column: the first lane's two cards until Show all. */
@media(max-width:760px){
 .tm-reviews,.lh-tm-grid.has-video .tm-reviews{display:flex;flex-direction:column;gap:12px;margin:0;padding:0;overflow:visible;scroll-snap-type:none}
 .rv-lane{display:contents}
 .tm-reviews .rv-card{flex:none;width:auto;max-width:none;padding:16px}
 .tm-reviews.is-collapsed .rv-lane:nth-child(n+2){display:none}
}
/* Doodle placements (src/studio/doodles.js). */
.how-head{display:flex;align-items:center;gap:24px}.how-head .doodle-tap svg{width:120px;height:auto}
.lh-hero .doodle-reel{margin:0 0 14px}.lh-hero .doodle-reel svg{width:64px;height:auto}
@media(max-width:760px){.how-head .doodle-tap svg{width:96px}.lh-hero .doodle-reel svg{width:52px}}

.account-check-loader{display:flex;align-items:center;gap:10px;padding:12px 0;color:var(--muted,#686760);font-size:14px}.account-check-loader .printing-mark{display:block;width:40px;height:28px}

/* Progress uses the same mark across Make, checkout and public forms. */
.inline-loading{display:inline-flex;align-items:center;gap:8px;vertical-align:middle;line-height:1.5}
.inline-loading .printing-mark{display:block;width:36px;height:26px;flex:0 0 36px}
.maker-account-message{margin:0 0 20px}
.account-check-loader{margin-bottom:16px}

#product-order-details{scroll-margin-top:112px}
.qr-purchase-status{margin:0 0 24px;padding:16px;border:1px solid #c9d8ca;border-radius:12px;background:#f2faf3;line-height:1.6;font-size:14px}
.qr-purchase-status .button,.qr-purchase-status .text-link{margin:12px 12px 0 0}
/* Shared sizing contract. Keep page-specific composition in the page stylesheet. */
:root{--text-body:16px;--text-small:14px;--text-title:clamp(36px,4.1vw,60px);--text-label:18px;--accent-scale:1.22;--button-radius:999px;--card-radius:26px;--card-inset:16px;--header-height:80px;--control-height:44px;--space-section:48px}
body{font-size:var(--text-body)}
.studio-feature h2,.studio-membership h2,.membership h2,.lh-h2{font-size:var(--text-title)}
h1 em,h2 em,h3 em,.workshop-feature h2 em{font-family:Caveat,cursive;font-size:calc(1em * var(--accent-scale))!important;font-weight:600;font-style:normal;line-height:1.05}
.button,.btn,.btn-gold,.btn-dark,.btn-outline,.prod-customise-cta,.sticky-mini-btn{border-radius:var(--button-radius);font-family:var(--sans);font-weight:600;letter-spacing:0;text-transform:none;min-height:var(--control-height)}
.image-path,.make-route-card,.model-card{border-radius:var(--card-radius)}
/* The phone hero sits on the orange photo (white phrase); the desktop hero is on white, so the phrase takes the Shop gold. */
body[data-site-area=shop] .hero-section .hero-h1 em,body[data-site-area=shop] .hero-section .hero-h1 [data-handwriting]{color:#fff!important}
@media(min-width:681px){body[data-site-area=shop] .hero-section .hero-h1 em,body[data-site-area=shop] .hero-section .hero-h1 [data-handwriting]{color:var(--gold,#FFBA08)!important}}
.sticky-mini-card{top:var(--header-height);padding:16px!important;gap:16px;background:#fff}
.sticky-mini-name,.prod-name,.prod-features h4,.prod-perfect-for h4,.prod-nfc-spec h4,.prod-dims h4{font-family:var(--heading)!important;font-style:normal;font-weight:600;color:var(--ink)!important}
.prod-features h4,.prod-perfect-for h4,.prod-nfc-spec h4,.prod-dims h4{font-size:var(--text-label);letter-spacing:0;text-transform:none}
.product-wrap:not(.product-wrap--customise){padding-bottom:24px}
.product-wrap--customise{padding-top:0!important}
#order-form>h3#configurator{margin-top:0;padding-top:24px;padding-bottom:24px}
#studioNav .shop-menu-content,#navLinks .shop-menu-content,.shop-menu-content:has(.product-lines){background:transparent;border:0;box-shadow:none;padding:0!important;border-radius:0!important}
.product-lines{gap:12px}
.product-line,.nav-links a.product-line{border:1px solid #deded7;background:#fff;box-shadow:0 6px 16px #00000008;border-radius:var(--button-radius)!important;padding:10px 16px 10px 10px!important}
.product-line:hover,.product-line:focus-visible{background:var(--gold,#ffba08)}
@media(max-width:1100px){:root{--header-height:76px}}
@media(max-width:760px){:root{--text-title:42px;--space-section:32px}.sticky-mini-card{padding:12px!important;gap:12px}.sticky-mini-name{font-size:16px}.sticky-mini-btn{font-size:12px;padding:10px 14px}.sticky-mini-img{width:48px;height:48px}}

.product-wrap--customise>.divider{margin:12px 0}
#order-form>h3#configurator{padding-top:12px;padding-bottom:12px}
/* Product previews use the full available width instead of a framed card. */
.cfg-box{border:0!important;border-radius:0!important;overflow:hidden;overflow-anchor:none;background:#f6f6f4}
@media(max-width:820px){#configurator-box.cfg-box,.maker-preview-3d.cfg-box{width:100vw!important;max-width:none;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important}}
@media(max-width:640px){.hl-card{flex-basis:calc((100vw - 38px)/1.5);min-width:0}.hl-body{padding:12px;gap:5px}.hl-name{font-size:16px}.hl-use{font-size:12px}.hl-footer{gap:6px;flex-wrap:wrap}.hl-pills{gap:4px}.hl-pill{padding:6px 8px;font-size:9px}.hl-cta{padding:9px 12px}.hl-proof{font-size:11px}}
/* Shared desktop configurator frame; mobile remains full-width. */
@media(min-width:821px){.cfg-box{border:2px solid #111!important;border-radius:26px!important;overflow:hidden}}
/* Shared header works on legacy product templates as well as studio pages. */
.masthead{padding:18px 4%;box-sizing:border-box;font-family:var(--sans);line-height:1.3}
.masthead .main-nav{position:static;background:transparent;border:0;padding:0;margin:0;box-shadow:none;width:auto;flex:0 1 auto}
.masthead .main-nav>a,.masthead .shop-menu [data-slot=navigation-menu-trigger],.masthead .shop-fallback summary,.masthead .utility>a:not(.pill){color:#111!important;text-decoration:none}
.masthead .wordmark{flex-shrink:0}.masthead .utility{flex-shrink:0}.masthead .nav-region{flex-shrink:0}
@media(min-width:1101px){.masthead .main-nav>a:hover,.masthead .main-nav>a:focus-visible,.masthead .shop-menu [data-slot=navigation-menu-trigger]:hover,.masthead .shop-menu [data-slot=navigation-menu-trigger]:focus-visible{color:#111!important;background:transparent}.masthead .main-nav>a{padding:8px 6px}.masthead .main-nav>a::after{display:none}.masthead .main-nav{gap:16px}.masthead .shop-menu [data-slot=navigation-menu-trigger]{padding:8px 6px}.masthead .region-btn{color:#111}}
@media(min-width:1101px) and (max-width:1280px){.masthead .utility .pill{display:none}.masthead .main-nav{gap:10px}}
/* Dark header variant: white line artwork and labels over the area colour. */
.masthead .main-nav{background:transparent!important}
@media(min-width:1101px){
 .masthead[data-header-tone=dark] .main-nav>a,.masthead[data-header-tone=dark] .shop-menu [data-slot=navigation-menu-trigger],.masthead[data-header-tone=dark] .shop-fallback summary,.masthead[data-header-tone=dark] .utility>a:not(.pill){color:#fff!important}
 .masthead[data-header-tone=dark] .main-nav .handdrawn-icon{stroke:currentColor;color:#fff}
 .masthead[data-header-tone=dark] .main-nav .handdrawn-icon .icon-color{fill:none}
 .masthead[data-header-tone=dark] .main-nav>a:hover,.masthead[data-header-tone=dark] .shop-menu [data-slot=navigation-menu-trigger]:hover{background:transparent}
}
/* Shared icon interaction: one short movement on entry, a small press on click. */
@keyframes nav-make-lift{0%,100%{transform:translateY(0)}45%{transform:translateY(-3px)}}
@keyframes nav-learn-tilt{0%,100%{transform:rotate(0)}40%{transform:rotate(-8deg)}70%{transform:rotate(4deg)}}
@keyframes nav-about-nod{0%,100%{transform:translateY(0) rotate(0)}45%{transform:translateY(1px) rotate(7deg)}}
@media(prefers-reduced-motion:no-preference){
 #studioNav>a .handdrawn-icon,.image-path .handdrawn-icon{transform-origin:center;transition:transform 120ms ease}
 #studioNav>a:focus-visible [data-icon=make],.image-path:focus-visible [data-icon=make]{animation:nav-make-lift 360ms ease}
 #studioNav>a:focus-visible [data-icon=learn],.image-path:focus-visible [data-icon=learn]{animation:nav-learn-tilt 360ms ease}
 #studioNav>a:focus-visible [data-icon=about],.image-path:focus-visible [data-icon=about]{animation:nav-about-nod 360ms ease}
 @media(hover:hover){
  #studioNav>a:hover [data-icon=make],.image-path:hover [data-icon=make]{animation:nav-make-lift 360ms ease}
  #studioNav>a:hover [data-icon=learn],.image-path:hover [data-icon=learn]{animation:nav-learn-tilt 360ms ease}
  #studioNav>a:hover [data-icon=about],.image-path:hover [data-icon=about]{animation:nav-about-nod 360ms ease}
 }
 #studioNav>a:active .handdrawn-icon,.image-path:active .handdrawn-icon{animation:none;transform:scale(.88)}
}

/* Returning members: desktop utility link and mobile menu entry share one route. */
@media(min-width:1101px){.masthead .utility>a.member-sign-in{display:inline-flex;align-items:center;min-height:44px;white-space:nowrap}.masthead #studioNav>.member-sign-in-mobile{display:none}}
@media(max-width:1100px){.masthead #studioNav>.member-sign-in-mobile{font-size:16px!important;min-height:48px;text-decoration:underline;text-underline-offset:4px}}
/* Reserve space outside focused fields so their rings cannot touch helper text.
   Shared by Shop, Make, Learn and embedded configurators. */
:root{--field-note-gap:16px}
body :is(input:not([type=hidden],[type=checkbox],[type=radio],[type=range],[type=color],[type=file]),textarea,select,[role=combobox],[data-studio-select],button,.control-row,.actions,.modal-actions,.download-row,.upload-zone) + :is(p,small,.small,.field-help,.form-error,.status,.co-note,.co-geo,.hint,.helper-text,.small-note,[data-field-help]){display:block;margin-block-start:var(--field-note-gap)}
/* These labels stack their text, control and helper using a flex gap. */
body .field:has(>:is(.small,small,.field-help)){row-gap:var(--field-note-gap)}
body .field>:is(input,textarea,select,[data-studio-select])+ :is(.small,small,.field-help){margin-block-start:0}

body label:has(>input:is([type=checkbox],[type=radio])){column-gap:var(--field-note-gap)}
.printing-mark .sl-accent{fill:var(--gold,#ffba08);stroke:none}
.printing-mark .sl-printed{stroke:var(--gold,#ffba08);stroke-width:3;opacity:.4}
.printing-mark .sl-line{stroke:var(--gold,#ffba08);stroke-width:3;stroke-dasharray:100;stroke-dashoffset:100;animation:sl-draw 2.4s ease-in-out infinite}
.printing-mark .sl-nozzle{animation:sl-move 2.4s ease-in-out infinite}
@keyframes sl-move{0%{transform:translateX(-30px)}70%{transform:translateX(30px)}100%{transform:translateX(-30px)}}
@keyframes sl-draw{0%{stroke-dashoffset:100;opacity:1}70%{stroke-dashoffset:0;opacity:1}88%,100%{stroke-dashoffset:0;opacity:0}}
@media(prefers-reduced-motion:reduce){.printing-mark .sl-nozzle,.printing-mark .sl-line{animation:none}.printing-mark .sl-line{stroke-dashoffset:0}}
.sketch-loader{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:8px;padding:56px 16px;color:var(--muted,#686760);text-align:center}
.sketch-loader p{margin:0;font-size:var(--text-small,14px)}

/* Hand-drawn doodles and moments (src/studio/doodles.js). Accent follows the page's --gold. */
.doodle{display:inline-block;line-height:0;flex:none}.doodle svg{display:block;overflow:visible}
.doodle .dd-accent{fill:var(--gold,#ffba08);stroke:none}
.doodle .dd-filament{stroke:var(--gold,#ffba08);stroke-width:14}.doodle .dd-strand{stroke:var(--gold,#ffba08);stroke-width:3}
/* Each doodle plays for under five seconds once it scrolls into view (experience.js adds .is-playing), then rests; hovering replays it. */
.doodle.is-playing .dd-phone{animation:dd-tap 2.4s ease-in-out 2}
.doodle-tap .dd-ripple{transform-box:fill-box;transform-origin:left center}.doodle.is-playing .dd-ripple{opacity:0;animation:dd-ripple 2.4s ease-out 2 backwards}
.doodle-tap .dd-ripple:nth-child(2){animation-delay:.14s}.doodle-tap .dd-ripple:nth-child(3){animation-delay:.28s}
.doodle.is-playing:hover *{animation-iteration-count:infinite}
@keyframes dd-tap{0%,100%{transform:translate(-12px,-20px)}30%,56%{transform:translate(0,0)}80%{transform:translate(-12px,-20px)}}
@keyframes dd-ripple{0%,30%{opacity:0;transform:scale(.7)}40%{opacity:1}72%,100%{opacity:0;transform:scale(1.15)}}
.doodle-reel .dd-reel{transform-box:fill-box;transform-origin:center}.doodle.is-playing .dd-reel{animation:dd-spin 4.5s cubic-bezier(.4,0,.3,1)}
@keyframes dd-spin{to{transform:rotate(360deg)}}
/* A tile flips to its new icon when the icon wheel settles. */
@keyframes tile-flip{from{transform:perspective(500px) rotateY(-90deg)}to{transform:perspective(500px) rotateY(0)}}
.tile-preview.is-flipping{animation:tile-flip .38s cubic-bezier(.3,.7,.4,1)}
/* A drawn underline under the handwritten words in section headings, once, as they come into view. */
.ink-underline{position:relative}.ink-underline.is-inline{display:inline-block}.ink-underline:not(.is-inline){width:fit-content}
.ink-strokes{position:absolute;inset:0;pointer-events:none}.ink-stroke{position:absolute;height:.15em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8C40 3 80 10.5 120 6.2S180 3.6 197 7' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M3 8C40 3 80 10.5 120 6.2S180 3.6 197 7' fill='none' stroke='%23000' stroke-width='4' stroke-linecap='round'/%3E%3C/svg%3E") center/100% 100% no-repeat;clip-path:inset(0 100% 0 0);transition:clip-path .9s cubic-bezier(.3,.7,.4,1) .15s;pointer-events:none}
.ink-underline.is-drawn .ink-stroke{clip-path:inset(0 0 0 0)}
@media(prefers-reduced-motion:reduce){.doodle *{animation:none!important;opacity:1!important}.tile-preview.is-flipping{animation:none}.ink-stroke{transition:none}}
