/* Studio opening, service atlas and journal reader. */
:root{--studio-nav:65px;--screen-height:100vh}
@supports(height:100dvh){:root{--screen-height:100dvh}}
/* Type Lens. The accessible headline and links exist independently of the optical layer. */
.type-cover{background:#ece9df;color:#23251f}
.type-layout{min-height:calc(var(--screen-height) - var(--studio-nav));width:min(100%,1920px);margin:auto;padding-block:clamp(16px,5.2vh,58px) clamp(16px,5vh,52px);display:grid;grid-template-rows:auto minmax(min-content,1fr) auto;container-type:inline-size}
.type-meta,.type-foot{margin-inline:3.75%;display:flex;justify-content:space-between;gap:24px}
.type-meta{align-items:flex-start}.type-meta .print-label{display:flex;align-items:center;gap:11px;padding-top:3px;letter-spacing:.1em;font-size:11px}
.type-meta .print-label:before{content:"";width:7px;height:7px;background:#b54d23;border-radius:50%}
.type-meta p{width:min(20.3%,375px);min-width:240px;font:400 clamp(15px,1.13vw,21px)/1.38 DM,sans-serif;letter-spacing:-.018em}
.type-scene{position:relative;overflow:clip;min-height:min(26vw,48vh);isolation:isolate}
.type-title{position:absolute;inset:0;font:inherit;margin:0}.type-title [data-lens-word]{position:absolute;white-space:nowrap;line-height:1;transform:translateY(-50%)}
.type-form{left:3.33%;top:calc(45% - min(2.7cqw,5vh));font:530 min(14.06cqw,29dvh)/1 Bricolage,Arial,sans-serif;letter-spacing:-.045em}
.type-and{left:34.44%;top:calc(45% - min(1.8cqw,3.5vh));font:420 min(9.56cqw,20dvh)/1 Bricolage,Arial,sans-serif;letter-spacing:-.06em;color:#b6542b}
.type-function{right:4.13%;top:calc(45% + min(2.1cqw,4.5vh));font:italic 400 min(13.69cqw,29dvh)/.98 Instrument,Georgia,serif;letter-spacing:-.065em}
.type-baseline{display:inline-block;width:0;height:0;vertical-align:baseline}
.type-object{position:absolute;z-index:1;left:50%;top:calc(45% - min(2.7cqw,5vh));width:min(27.45cqw,53dvh);aspect-ratio:1;transform:translate(calc(-50% + var(--slide,0px)),-50%);user-select:none;-webkit-user-select:none;touch-action:pan-y pinch-zoom}
.type-object img,.type-object canvas{display:block;width:100%;height:100%;position:absolute;inset:0;pointer-events:none;filter:drop-shadow(.7cqw .85cqw .48cqw #28271d28)}
.type-object canvas{visibility:hidden}.type-object[data-drawn] canvas{visibility:visible}.type-object[data-drawn] img{visibility:hidden}
.type-object[data-ready]{cursor:grab}.type-object[data-dragging]{cursor:grabbing}
.lens-gesture{position:absolute;z-index:2;left:50%;top:min(calc(100% - 44px),calc(45% + min(10.8cqw,22vh)));transform:translateX(-50%);display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:44px;white-space:nowrap;background:transparent;color:#54574c;font:400 10px/1.35 Plex,monospace;letter-spacing:.07em;text-transform:uppercase}
.lens-gesture>span:first-child{width:31px;height:31px;border:1px solid #999d8f;border-radius:50%;display:grid;place-items:center}
.lens-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.type-foot{align-items:flex-end;border-top:1px solid #b8b9ab;padding-top:clamp(14px,2.9vh,30px)}
.type-foot p{font:400 clamp(18px,1.5cqw,29px)/1.12 Bricolage,Arial,sans-serif;letter-spacing:-.04em;margin-top:9px}
.type-foot .cover-links{display:flex;flex-wrap:wrap;gap:clamp(18px,1.7vw,32px);align-items:center}
.type-foot .cover-links a{font:500 clamp(14px,1vw,18px)/1.25 DM,sans-serif;display:inline-flex;align-items:center;gap:12px;min-height:44px}
.type-foot .cover-links .cover-primary{background:#1b1c18;color:#f6f2e9;padding:14px 19px;transition:background .3s}
.type-foot .cover-links .cover-primary:hover{background:var(--rust)}
.type-foot .cover-links a:last-child{text-decoration:underline;text-underline-offset:5px}.cover-links a>span[aria-hidden]{text-decoration:none}
@media(max-width:700px) and (min-height:511px){
 .type-layout{padding-block:clamp(18px,3.8vh,32px) clamp(17px,3vh,26px)}
 .type-meta,.type-foot{margin-inline:5.5%;gap:14px;flex-direction:column;align-items:flex-start}.type-meta .print-label{font-size:9px}
 .type-meta p{font-size:clamp(15px,3.7vw,19px);width:auto;min-width:0}
 .type-scene{min-height:min(55vw,33vh)}
 .type-form{left:5.2%;top:calc(45% - min(11cqw,60px));font-size:20.2cqw}.type-and{left:51%;top:calc(45% - min(9cqw,50px));font-size:13.8cqw}
 .type-function{right:5.4%;top:calc(45% + min(13cqw,76px));font-size:25.5cqw}
 .type-object{left:77%;top:calc(45% - min(17cqw,84px));width:min(44cqw,27dvh)}
 .lens-gesture{top:min(calc(100% - 44px),calc(45% + min(31cqw,170px)));font-size:9px;gap:8px}.lens-gesture>span:first-child{width:25px;height:25px}
 .type-foot{padding-top:14px}.type-foot p{font-size:19px;margin-top:4px}.type-foot .cover-links{gap:16px}.type-foot .cover-links a{gap:7px}
 .type-foot .cover-links .cover-primary{padding:10px 12px}
}
@media(orientation:landscape) and (max-height:510px){
 .type-layout{padding-block:10px}.type-meta{align-items:center}.type-meta .print-label{font-size:9px}.type-meta p{font-size:13px;min-width:210px}
 .type-scene{min-height:120px}.type-foot{padding-top:8px}.type-foot p{font-size:16px;margin-top:3px}
 .type-foot .cover-links .cover-primary{padding:8px 12px}.type-object{width:min(26cqw,44dvh)}
 .lens-gesture{top:72%;font-size:8px;gap:6px}.lens-gesture>span:first-child{width:24px;height:24px}
}

.look-caption>a,.library-intro a,.practice-inner>a{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:14px;font-weight:500;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.practice-gallery figcaption,.look-image>p,.working-steps li>span,.working-steps li>small{font:400 10px/1.5 Plex,monospace;letter-spacing:.045em;text-transform:uppercase}
.practice-gallery figcaption,.look-image>p{display:flex;align-items:center;justify-content:space-between;gap:15px}

.screen-page-heading{margin:0;font:500 clamp(22px,2.1vw,38px)/1 Bricolage,Arial,sans-serif;letter-spacing:-.04em;text-transform:none}
.practice,.working-steps,.home-library{padding:clamp(62px,7vw,133px) var(--gutter)}
.practice{background:#e4e1d4}
.practice-heading,.library-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:6vw;align-items:end;margin-bottom:clamp(27px,3.1vw,58px)}
.practice-heading :is(h1,h2),.library-intro h2,.steps-title h2,.look-caption h2{font:500 clamp(53px,6.8vw,124px)/.94 Bricolage,sans-serif;letter-spacing:-.058em;margin:18px 0 0}
.practice-heading p,.library-intro p{font-size:clamp(16px,1.35vw,24px);max-width:33ch;line-height:1.42;letter-spacing:-.018em}
.practice-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(28px,6vw,105px);align-items:start}
.practice-gallery{position:relative;display:grid;isolation:isolate}
.practice-gallery figure{grid-area:1/1;opacity:0;transform:translateY(5px);transition:opacity .42s ease,transform .55s var(--ease)}
.practice-gallery figure.current{opacity:1;transform:none;z-index:1}
.practice-gallery img{width:100%;height:auto}.practice-gallery figcaption{background:#e4e1d4;color:#43473d;padding-block:12px}
.practice-list{border-bottom:1px solid #abae9d}.practice-item{border-top:1px solid #abae9d}
.practice-item summary{list-style:none;display:grid;align-items:center;grid-template-columns:27px 1fr 33px;gap:13px;cursor:pointer;padding:clamp(15px,1.55vw,27px) 0;min-height:62px}
.practice-item summary::-webkit-details-marker{display:none}
.practice-item summary small{font:10px Plex,monospace;color:#55594e}
.practice-item summary strong{font:500 clamp(22px,2.45vw,45px)/1.07 Bricolage,sans-serif;letter-spacing:-.046em}
.fold-sign{display:grid;place-items:center;position:relative;width:29px;height:29px;border:1px solid #9a9f8e;border-radius:50%;transition:background .35s,color .35s}
.fold-sign:before,.fold-sign:after{content:"";width:11px;height:1px;background:currentColor;position:absolute}
.fold-sign:after{rotate:90deg;transition:rotate .42s var(--ease)}
.practice-item[data-intent=open] .fold-sign,.practice-item[open]:not([data-intent]) .fold-sign{color:var(--paper);background:var(--ink);border-color:var(--ink)}
.practice-item[data-intent=open] .fold-sign:after,.practice-item[open]:not([data-intent]) .fold-sign:after{rotate:0deg}
.practice-body{overflow:clip}
.practice-inner{padding:0 36px 21px 40px;max-width:66ch}
.practice-inner p{font-size:clamp(15px,1.15vw,20px);line-height:1.5}
.practice-inner .output-line{font-size:14px;margin-block:12px 3px;color:#464a40}
.output-line b{display:block;font:10px Plex,monospace;letter-spacing:.035em;text-transform:uppercase;margin-bottom:5px}
.practice-inline{width:min(100%,360px);height:auto;margin-bottom:16px}
.atlas-ready .practice-inline{display:none}
.service-plate img{background:transparent}
.close-look{background:#302e25;color:#f3eddd;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(25px,6vw,115px);align-items:center;padding:clamp(55px,7.3vw,128px) var(--gutter)}
.look-image{background:#d3c3a5;color:#332d23;padding:clamp(12px,2.3vw,43px);box-shadow:4px 6px 14px #080a061c;transform:rotate(-1.6deg)}
.look-image img{width:100%;height:auto;display:block}.look-image>p{padding-top:13px}
.look-caption h2{font-size:clamp(42px,4.5vw,85px);line-height:.99}
.look-caption h2 em{color:#ebc29f}.look-caption>p{margin-block:21px 12px;max-width:43ch;line-height:1.5;color:#e1dfd1}
.working-steps{background:#f1eee4}
.steps-title h2{max-width:16ch}
.working-steps ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(22px,4.2vw,80px);list-style:none;padding:0;margin:clamp(35px,4vw,72px) 0 0}
.working-steps li{display:flex;flex-direction:column;border-top:2px solid #46493c;padding-top:14px}
.working-steps li>span{color:#693e25}.working-steps h3{font:500 clamp(25px,2.55vw,45px)/1.06 Bricolage,sans-serif;letter-spacing:-.042em;margin:22px 0 13px}
.working-steps li p{max-width:42ch;line-height:1.48;margin-bottom:24px}
.working-steps li small{display:block;margin-top:auto;color:#626354}
.working-steps li b{display:block;margin-top:5px;font-size:16px}
.home-library{background:#d9d6c8}
.home-library .book-shelf{margin-top:35px}
.library-intro a{margin-top:6px}
.footer .foot-invite{display:flex;flex-wrap:wrap;gap:.17em;align-items:center;font-size:clamp(43px,7.7vw,136px);line-height:1.04}
.footer .foot-invite span{flex-shrink:0}
.reading>section p+p{margin-top:1em}
.journal-exercise{margin:clamp(36px,5vw,80px) 0 35px;padding:clamp(22px,3vw,48px);background:#dedaca;border-left:3px solid #b5592d}
.journal-exercise h2{margin:15px 0}.journal-exercise ol{padding-left:1.4em;margin:20px 0 0}.journal-exercise li{margin:9px 0;line-height:1.5}
.journal-sources{border-top:1px solid var(--line);padding-top:25px}.journal-sources h2{font-size:26px}.journal-sources a{display:block;text-decoration:underline;text-underline-offset:4px;line-height:1.5}
.practice-item summary:focus-visible,.cover-links a:focus-visible,.lens-gesture:focus-visible,.frame-keys button:focus-visible{outline:3px solid #aa4c22;outline-offset:3px}
.screening .frame-keys button:focus-visible{outline-color:#ffc293}
@media(max-width:900px){.practice-layout{gap:25px}.practice-inner{padding-right:8px}.working-steps ol{gap:25px}}
@media(max-width:700px){
 .practice-heading,.library-intro{grid-template-columns:1fr;gap:14px;margin-bottom:25px}
 .practice-heading :is(h1,h2),.library-intro h2,.steps-title h2{font-size:clamp(46px,11vw,74px);margin-top:13px}
 .practice-heading p,.library-intro p{font-size:16px;max-width:39ch}
 .practice-layout{grid-template-columns:1fr}.practice-gallery{display:none}.atlas-ready .practice-inline{display:block}
 .practice-item summary{grid-template-columns:22px 1fr 28px;gap:10px}.practice-inner{padding:0 0 18px 32px}.practice-inline{aspect-ratio:2.1;object-fit:cover;max-width:100%}
 .close-look{grid-template-columns:1fr;gap:30px}.look-image{width:calc(100% - 8px);justify-self:center}
 .look-caption>p{margin:15px 0 7px}.working-steps ol{grid-template-columns:1fr;gap:24px}.working-steps li{padding-top:12px}.working-steps h3{margin:12px 0 8px}.working-steps li p{margin-bottom:12px}
 .home-library .book-shelf{margin-top:26px}
}
@media(max-width:570px){:root{--studio-nav:59px}}
html.quiet .practice-gallery figure{transition:none}

.opening-skip:focus-visible{outline:3px solid #1d211b;outline-offset:1px}

.studio-opening{display:none}
html[data-arrival=intro]:not(.quiet) .studio-opening{display:grid;position:fixed;inset:0;z-index:110;place-items:center;isolation:isolate;background:#ebe7dc;color:#20231d}
.opening-signature{display:flex;align-items:center;justify-content:center;gap:clamp(18px,3vw,55px);padding:22px}
.opening-mark{display:block;width:clamp(60px,10vw,153px);height:auto;overflow:visible}
.opening-mark path{transform-box:fill-box;transform-origin:center}
.opening-mark path:last-of-type{stroke:#1a1c19;stroke-width:.65;stroke-dasharray:420;animation:ink-orbit 1.12s var(--ease) both}
.opening-mark path:first-of-type{animation:place-bead .80s var(--ease) both}
.opening-mark path:nth-of-type(2),.opening-mark path:nth-of-type(3){animation:cut-star .78s .20s var(--ease) both}
.opening-signature>div>img{display:block;width:clamp(158px,29vw,455px);height:auto}
.opening-signature p{font:400 clamp(12px,1.24vw,20px)/1.4 Bricolage,Arial,sans-serif;margin:clamp(11px,1vw,17px) 0 0;color:#3e4238}
.opening-base,.opening-skip{font:400 11px/1.45 Plex,monospace;letter-spacing:.035em}
.opening-skip{position:absolute;top:max(14px,3.5vh);right:var(--gutter);border:0;background:transparent;color:inherit;padding:12px 4px;cursor:pointer}
.opening-base{position:absolute;bottom:max(21px,5vh);left:var(--gutter);right:var(--gutter);display:flex;gap:18px;align-items:center}
.opening-base i{flex:1;overflow:hidden;height:2px;background:#cbc6b9}
.opening-base b{display:block;height:100%;background:#98603e;transform-origin:left;animation:opening-rule 2.7s cubic-bezier(.19,.63,.35,1) both}
.studio-opening[data-ready=true]{animation:lift-paper .45s cubic-bezier(.68,0,.30,1) both}
@keyframes ink-orbit{0%{stroke-dashoffset:420;fill-opacity:.03}68%{stroke-dashoffset:0;fill-opacity:.25}100%{stroke-dashoffset:0;fill-opacity:1}}
@keyframes place-bead{from{transform:translate(-3px,5px);opacity:0}to{transform:none;opacity:1}}
@keyframes cut-star{from{transform:scale(.58) rotate(-20deg);opacity:0}to{transform:none;opacity:1}}
@keyframes opening-rule{from{transform:scaleX(.015)}to{transform:scaleX(1)}}
@keyframes lift-paper{to{opacity:0;transform:translateY(-13px)}}
@media(max-width:570px){.opening-signature{gap:14px}.opening-signature p{max-width:24ch}.opening-skip,.opening-base{font-size:10px}}
@media(prefers-reduced-motion:reduce){html[data-arrival=intro] .studio-opening{display:none}}