/* Reserved edge rail keeps the persistent player clear of reading and controls. */
.portable-ready{--portable-rail:176px}
.portable-ready body{width:calc(100% - var(--portable-rail))}
.portable-companion{position:fixed;top:0;left:0;width:160px;z-index:40;user-select:none;pointer-events:none;contain:layout style;will-change:transform;filter:drop-shadow(3px 7px 5px #0004)}
.portable-companion[hidden]{display:none}
.portable-object{position:relative}
.portable-companion svg{display:block;width:100%;height:auto}
.portable-play{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;margin:-13px 0 0 7px;width:99px;min-height:46px;border:2px solid #343c3c;border-radius:3px;background:linear-gradient(#f1eee0,#b7bcb4);box-shadow:0 4px 0 #303938,inset 0 1px #fff;color:#202b2b;font:11px monospace;cursor:pointer;pointer-events:auto;touch-action:manipulation}
.portable-play:active,.portable-play[aria-pressed=true]{box-shadow:0 1px 0 #303938;top:3px}
.portable-play:focus-visible{outline:3px solid #e76b18;outline-offset:4px}
.portable-perch{height:190px;margin:20px auto 0;position:relative;pointer-events:none}
.portable-perch>span{position:absolute;right:8px;bottom:0;font:9px monospace;color:#6f6659}
.portable-reel{animation:portable-reel 7s linear infinite;animation-play-state:paused}.is-playing .portable-reel{animation-play-state:running}
.is-docked .portable-object{animation:none}
@keyframes portable-drift{50%{transform:translateY(-3px)}}
@keyframes portable-reel{to{transform:rotate(360deg)}}
@media(max-width:700px){.portable-ready{--portable-rail:104px}.portable-companion{width:96px}.portable-play{width:86px;margin:-6px 0 0 3px;font-size:10px}.portable-perch{height:145px}.portable-perch>span{font-size:7px}}
@media(prefers-reduced-motion:reduce){.portable-object,.portable-reel{animation:none!important}}
/* Size the hero to its available column, including the reserved companion rail. */
.portable-ready .hero-copy{container-type:inline-size}
.portable-ready .hero-title{font-size:clamp(48px,8cqw,158px)}
@media(max-width:1000px){.portable-ready .hero-title{font-size:clamp(40px,11cqw,100px)}}
@media(max-width:700px){.portable-ready .hero-title{font-size:clamp(27px,12cqw,75px)}.portable-ready .site-nav{flex-wrap:wrap;justify-content:flex-start;column-gap:15px}.portable-ready .section-pad{padding-left:12px;padding-right:12px}}
@media(max-width:700px){.portable-ready .touch-yarn-game .lauren-character{width:min(150px,42%)}.portable-ready .touch-yarn-game .lauren-character::before{inset:-8px}.portable-ready .display-title{font-size:clamp(32px,8vw,60px)}.portable-ready .contact-title{font-size:clamp(32px,8vw,60px)}.portable-ready .section-kicker{flex-wrap:wrap}}

/* P1-01: phones have no floating player or reserved rail. */
@media(max-width:1024px){.portable-ready{--portable-rail:0px}.portable-ready body{width:100%}.portable-companion,.portable-perch{display:none!important;pointer-events:none!important}}

@media(max-width:1024px){.hero{overflow:clip}}

/* Reserve the settled mobile header before deferred navigation initializes. */
@media(max-width:760px){.p1-layout-ready .site-header:not(.nav-ready){height:68px;min-height:68px;flex-wrap:nowrap}.p1-layout-ready .site-header:not(.nav-ready) .site-nav{display:none}}
