/* One studio, three ways of working: paper, brass and midnight blue. */
#experience.is-room { --studio-accent:#C6AB83; }
#experience[data-part="part-02"] { --studio-accent:#BAACCF; }
#experience[data-part="part-03"] { --studio-accent:#A1BCC8; }
.room-heading { display:block; top:174px; left:4.5vw; width:22vw; }
.room-heading .micro-label { font:9px var(--mono); letter-spacing:.15em; color:var(--studio-accent); }
.room-heading h2 { margin:14px 0; font-size:clamp(27px,2.7vw,40px); line-height:1.2; }
.room-sub { max-width:245px; font-size:11px; color:#ded5c3a6; line-height:1.9; }
.work-preview { position:absolute; left:4.5vw; top:43%; width:min(250px,22vw); color:#EEE5D5; pointer-events:auto; }
.work-preview__step { font:9px var(--mono); letter-spacing:.14em; color:var(--studio-accent); }
.work-preview__title { margin:15px 0 9px; font:400 clamp(22px,2vw,30px)/1.35 var(--serif); text-wrap:balance; }
.work-preview__meta { font-size:10px; color:#EEE5D58c; line-height:1.6; }
.work-preview__blurb { margin:16px 0 18px; font-size:11px; line-height:1.85; color:#EEE5D5b3; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.work-preview__open { width:100%; max-width:235px; min-height:45px; display:flex; justify-content:space-between; align-items:center; padding:11px 17px; border:1px solid #CDB69388; border-radius:4px; background:#EEDFC6; color:#302D32; font:12px var(--sans); transition:background .18s,transform .18s,box-shadow .18s; }
.work-preview__open i { font-style:normal; transition:transform .18s; }
.work-preview__open:hover { background:#FFF2DA; box-shadow:0 4px 24px #D3B88B22; }
.work-preview__open:hover i { transform:translate(2px,-2px); }
.work-preview__open:active { transform:translateY(1px); }
.work-preview__open:focus-visible { outline:2px solid #EEDFC6; outline-offset:4px; }
.work-preview__guide { margin-top:12px; color:#E5DBC380; font-size:9px; line-height:1.6; }
.work-preview__status { position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%); }
.room-hint { display:none; }
.work-strip { width:min(770px,64vw); left:auto; right:4.5vw; transform:none; gap:0; border-top:1px solid #D6C3A33b; border-bottom:1px solid #D6C3A31f; }
.room-work { border:0; border-radius:0; background:#141928bd; backdrop-filter:blur(8px); padding:12px 14px; gap:9px; transition:background .18s,color .18s; min-height:55px; }
.room-work::before { display:none; }
.room-work__index { display:block; font:10px var(--mono); color:#C6AB8370; }
.room-work__kind { display:none; }
.room-work__title { font:12px var(--serif); }
.room-work__meta { font-size:9px; }
.room-work.is-selected { background:#C8B18C18; box-shadow:inset 0 2px var(--studio-accent); }
.room-work.is-selected .room-work__index { color:var(--studio-accent); }
.room-work:hover,.room-work:focus-visible { transform:none; background:#C8B18C26; outline:1px solid #C8B18C66; outline-offset:-1px; }
#experience.is-room .room-heading { animation:studio-copy-in .6s both; }
#experience.is-room .work-preview { animation:studio-copy-in .7s .1s both; }
#experience.is-room .work-strip { animation:studio-copy-in .6s .16s both; }
@keyframes studio-copy-in { from {opacity:0;translate:0 12px;} to {opacity:1;translate:0 0;} }
body.work-focused:not(.viewer-open) .room-ui { opacity:0; transition:opacity .2s; pointer-events:none; }
body.work-focused:not(.viewer-open) .room-ui button { pointer-events:none; }
.screening { border-radius:6px; background:#101420; border-color:#D6C3A34d; }
.screening[open] { animation:none; }
.screening::backdrop { backdrop-filter:none; background:#060914ed; }
.screening__bar,.screening__copy { background:#101420; }
.screening__stage { position:relative; z-index:2; transform-origin:top left; }
.screening__stage video { aspect-ratio:16/9; object-fit:contain; }
.reader { border-radius:6px; }
.room-ui { transition:opacity .2s; }
@media(max-width:1050px) and (min-width:721px) {
  .room-heading { width:21vw; left:3vw; }
  .work-preview { left:3vw; width:21vw; }
  .work-preview__blurb { -webkit-line-clamp:2; }
}
@media(max-width:720px), (max-width:1099px) and (max-aspect-ratio:20/19) {
  .hall-back { top:82px; }
  .room-heading { display:block; top:138px; left:6vw; width:88vw; text-align:left; }
  .room-heading .micro-label { font-size:8px; }
  .room-heading h2 { margin:7px 0; font-size:28px; }
  .room-sub { display:none; }
  .work-preview { top:auto; bottom:151px; left:6vw; width:88vw; display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:12px; align-items:center; }
  .work-preview__step { font-size:8px; grid-column:1; }
  .work-preview__title { font-size:20px; margin:7px 0 5px; grid-column:1; }
  .work-preview__meta { font-size:9px; grid-column:1; }
  .work-preview__open { grid-column:2; grid-row:1/4; gap:14px; width:auto; padding-inline:14px; min-height:45px; font-size:11px; }
  .work-preview__blurb,.work-preview__guide { display:none; }
  .work-strip { width:88vw; left:6vw; right:auto; bottom:78px; display:flex; overflow:visible; }
  .room-work { min-height:52px; padding:8px; grid-template-columns:auto minmax(0,1fr); gap:5px; }
  .room-work__index { font-size:8px; }
  .room-work__title { font-size:11px; }
  .room-work__meta { display:none; }
  .screening { width:calc(100vw - 16px); }
}
@media(max-width:720px) {
  .exp-header { gap:8px; }
  .exp-brand { flex-shrink:0; gap:7px; }
  .brand-copy { white-space:nowrap; }
  .brand-copy b { font-size:10px; }
  .brand-copy small { font-size:7px; letter-spacing:.12em; }
  .header-tools { flex-shrink:0; gap:4px; }
  .header-tools button { white-space:nowrap; padding-inline:8px; gap:5px; }
}
@media(max-height:680px) and (min-width:721px) {
  .room-heading { top:166px; }
  .room-heading h2 { font-size:27px; margin:8px 0; }
  .room-sub { display:none; }
  .work-preview { top:40%; }
  .work-preview__title { font-size:22px; margin:9px 0; }
  .work-preview__blurb { -webkit-line-clamp:2; margin:10px 0; }
  .work-preview__guide { display:none; }
}
@media(max-height:520px) and (min-width:721px) {
  .room-heading { display:none; }
  .room-heading h2 { font-size:23px; }
  .room-heading .micro-label { font-size:8px; }
  .work-preview { top:45%; }
  .work-preview__step,.work-preview__blurb,.work-preview__meta { display:none; }
  .work-preview__title { font-size:18px; }
  .work-preview__open { min-height:36px; }
  .work-strip { bottom:58px; }
  .room-work { min-height:38px; padding-block:6px; }
}
@media(max-width:720px) and (max-height:700px) {
  .room-heading { top:130px; }
  .room-heading h2 { font-size:24px; }
  .work-preview { bottom:140px; }
  .work-preview__title { font-size:17px; }
  .work-preview__meta { display:none; }
}
@media(prefers-reduced-motion:reduce) {
  #experience.is-room .room-heading,#experience.is-room .work-preview,#experience.is-room .work-strip { animation:none; }
}
body.is-motion-reduced #experience.is-room .room-heading,body.is-motion-reduced #experience.is-room .work-preview,body.is-motion-reduced #experience.is-room .work-strip { animation:none; }

/* Real process photographs: a small invitation in space, a paper journal within. */
html:has(.process-journal[open],.lightbox.lb--photo[open]) { overflow:hidden; }
.process-dock { position:fixed; left:4.5vw; bottom:100px; z-index:20; pointer-events:auto; }
.process-dock[hidden] { display:none; }
.process-dock__open { display:flex; align-items:center; gap:18px; padding:13px 19px 13px 13px; border:1px solid #d4bd9444; border-radius:5px; background:#121727e8; color:#eee5d5; text-align:left; backdrop-filter:blur(12px); }
.process-miniatures { display:flex; align-items:center; padding-left:2px; }
.process-miniatures img { width:36px; height:46px; object-fit:cover; border:3px solid #eee4d0; box-shadow:0 2px 6px #0005; transform:rotate(-7deg); }
.process-miniatures img + img { margin-left:-11px; transform:rotate(5deg); }
.process-miniatures img:last-child { transform:rotate(-3deg); }
.process-dock__copy { display:grid; gap:6px; }
.process-dock__copy small { font:8px var(--mono); letter-spacing:.14em; color:#c8ae85; }
.process-dock__copy b { font:400 13px var(--serif); }
.process-dock__open i,.about-process > i { font-style:normal; color:#b99a6d; }
.process-dock__open:hover { background:#272a38; border-color:#d4bd94aa; }
.process-dock__open:focus-visible,.about-process:focus-visible { outline:2px solid #bd9d70; outline-offset:4px; }
.about-process { display:flex; align-items:center; gap:22px; margin:0 clamp(20px,4vw,40px) 24px; width:calc(100% - clamp(40px,8vw,80px)); padding:17px; background:#e9deca; border:1px solid #a88c5d42; border-radius:5px; text-align:left; color:#493b33; }
.about-process:hover { background:#e1d3b9; }
.about-process__photos { display:flex; gap:5px; flex-shrink:0; }
.about-process__photos img { height:72px; width:52px; object-fit:cover; border:3px solid #f9f2e5; }
.about-process__photos img:first-child { transform:rotate(-4deg); }
.about-process__photos img:last-child { transform:rotate(4deg); }
.about-process__copy { display:grid; gap:7px; flex:1; }
.about-process__copy small { font:8px var(--mono); color:#937650; letter-spacing:.1em; }
.about-process__copy b { font:400 24px var(--serif); }
.about-process__copy > span { font-size:11px; line-height:1.7; color:#766659; }
.process-journal { width:min(1050px,94vw); max-width:none; max-height:92svh; margin:auto; padding:0; overflow:auto; overscroll-behavior:contain; border:1px solid #c5b393; border-radius:5px; background:#f1e9db; color:#423b36; box-shadow:0 24px 100px #0006; }
.process-journal::backdrop { background:#060b18dc; backdrop-filter:blur(12px); }
.process-journal__header { display:flex; justify-content:space-between; align-items:start; padding:30px 36px 0; }
.process-kicker { color:#8b7051; font:9px var(--mono); letter-spacing:.17em; }
.process-journal h2 { margin:12px 0 0; font:400 clamp(30px,3.5vw,43px)/1.2 var(--serif); letter-spacing:.06em; }
.process-close { flex-shrink:0; display:grid; place-items:center; width:44px; height:44px; margin:-6px -12px 0 12px; background:transparent; border:1px solid #9d85604d; border-radius:50%; color:#6e5c49; font:26px/1 var(--sans); }
.process-close:hover,.process-close:focus-visible { background:#473e35; color:#f8f0df; outline:2px solid #ac906b; outline-offset:3px; }
.process-journal__intro { display:grid; grid-template-columns:1fr 1.25fr; align-items:start; gap:40px; margin:20px 36px 26px; padding-bottom:22px; border-bottom:1px solid #a38b643b; }
.process-lead { font:400 17px/1.8 var(--serif); }
.process-intro { font:11px/1.9 var(--sans); color:#7b6c5d; }
.process-spread { display:grid; grid-template-columns:.82fr 1.35fr; column-gap:30px; row-gap:24px; padding:0 36px 24px; }
.process-note { min-width:0; }
.process-note--on-set { grid-column:1; grid-row:1/3; }
.process-note--location-sound { grid-column:2; display:grid; grid-template-columns:1.1fr .9fr; gap:22px; align-items:center; }
.process-note--location-sound .process-note__copy { padding-top:0; }
.process-note--editing-timeline { grid-column:2; }
.process-photo { position:relative; display:block; width:100%; padding:7px; border:1px solid #b4a08247; background:#fffaf0; box-shadow:0 4px 12px #54402812; cursor:zoom-in; }
.process-photo img { display:block; width:100%; height:auto; object-fit:contain; }
.process-photo > span { position:absolute; right:13px; bottom:13px; display:grid; place-items:center; width:28px; height:28px; background:#141826bd; color:#f9ecd7; border:1px solid #f9ecd744; border-radius:50%; font-size:14px; }
.process-photo:hover,.process-photo:focus-visible { outline:2px solid #af9065; outline-offset:3px; }
.process-note__copy { padding:14px 2px 0; }
.process-note__tag { font:8px var(--mono); letter-spacing:.13em; color:#977751; }
.process-note h3 { margin:7px 0; font:400 20px/1.5 var(--serif); }
.process-note__body { font:12px/1.85 var(--sans); color:#7b6b5d; }
.process-note--on-set .process-note__body { max-width:250px; }
.process-journal__footer { display:flex; justify-content:space-between; gap:16px; margin:0 36px; padding:16px 0 20px; border-top:1px solid #a38b643b; color:#9b8261; }
.process-journal__footer span { font:8px/1.7 var(--mono); letter-spacing:.1em; }
.process-journal__footer p { font-size:10px; line-height:1.7; }
.lightbox.lb--photo { padding:64px 4vw 142px; }
.lightbox.lb--photo .lb-body img { max-height:calc(100svh - 290px); max-width:90vw; transition:transform .2s; cursor:zoom-in; }
.lightbox.lb--photo.is-art-zoomed .lb-body { overflow:auto; }
.lightbox.lb--photo.is-art-zoomed .lb-body img { transform:scale(1.65); cursor:zoom-out; }
.lightbox.lb--photo .art-tools { bottom:20px; }
.lightbox.lb--photo .lb-cap { font-size:12px; line-height:1.8; }
.sf-process { padding:42px 0; }
.sf-process > h2 { font:400 34px var(--serif); margin:12px 0; }
.sf-process > p { color:var(--ink-soft); line-height:1.9; }
.sf-process-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-top:28px; }
.sf-process-grid img { width:100%; height:220px; object-fit:contain; background:#e7dfd1; }
.sf-process-grid h3 { font:400 20px var(--serif); margin:14px 0 8px; }
.sf-process-grid p { font-size:12px; line-height:1.8; color:var(--ink-soft); }
@media(max-width:720px) {
  .process-dock { left:5vw; bottom:calc(82px + env(safe-area-inset-bottom,0px)); }
  .process-dock__open { padding:10px 14px; gap:13px; }
  .process-miniatures img { height:38px; width:29px; }
  .process-dock__copy small { font-size:7px; }
  .process-dock__copy b { font-size:12px; }
  .about-process { margin:0 18px 20px; width:calc(100% - 36px); padding:13px; gap:14px; }
  .about-process__photos { gap:0; }
  .about-process__photos img { width:34px; height:51px; }
  .about-process__photos img + img { margin-left:-9px; }
  .about-process__copy b { font-size:21px; }
  .about-process__copy small { font-size:6px; }
  .about-process__copy > span { font-size:10px; }
  .process-journal { width:calc(100vw - 20px); max-height:calc(100svh - 24px); }
  .process-journal__header { padding:24px 20px 0; }
  .process-journal h2 { font-size:32px; }
  .process-journal__intro { grid-template-columns:1fr; gap:8px; margin:17px 20px 22px; padding-bottom:18px; }
  .process-lead { font-size:16px; }
  .process-spread { display:block; padding:0 20px; }
  .process-note { margin-bottom:26px; }
  .process-note--location-sound { display:block; }
  .process-note--location-sound .process-note__copy { padding-top:14px; }
  .process-note--on-set .process-photo { width:78%; margin:0 auto; }
  .process-note--location-sound .process-photo img,.process-note--editing-timeline .process-photo img { max-height:none; }
  .process-note--on-set .process-note__body { max-width:none; }
  .process-note__body { font-size:12px; }
  .lightbox.lb--photo { padding:64px 3vw 112px; }
  .lightbox.lb--photo .lb-body img { max-height:calc(100svh - 310px); max-width:94vw; }
  .lightbox.lb--photo .lb-cap { max-width:90vw; font-size:11px; }
  .lightbox.lb--photo .art-tools { gap:6px; }
  .lightbox.lb--photo .art-tools > * { padding-inline:13px; font-size:11px; }
  .process-journal__footer { margin:0 20px; flex-wrap:wrap; gap:6px; }
  .sf-process-grid { grid-template-columns:1fr; }
}
@media(max-height:520px) and (min-width:721px) {
  .process-dock { bottom:65px; }
  .process-dock__open { padding:8px 12px; }
  .process-miniatures img { height:30px; width:24px; border-width:2px; }
}
