/* The studio stays dark whatever the site theme (WY, 2026-09-25): its daylight rules now sit behind html.studio-light, which nothing sets. Restore by renaming back to html:not(.dark). */
/*
 * The studio's stylesheet, scoped under .studio-page.
 *
 * Generated from docs/design/motion-study.css by prefixing every selector —
 * `body` becomes the wrapper, everything else becomes its descendant. No
 * value, no rule and no media query was changed: the study's colours, type
 * and motion are exactly as they were. The scope exists because the file
 * styles `body`, `*`, `button`, `a` and `input` globally, which would
 * otherwise reach every other page on the site.
 *
 * Edit this file. docs/design/motion-study.css stays as the original study.
 */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650;700&family=Instrument+Serif:ital@0;1&display=swap');
:root{--bg:#1c1d1c;--panel:#202120;--line:#343634;--muted:#989d97;--text:#e8e9e2;--accent:#e5bf9b;--stage:#141515;--paper:#f0e9de;--corner:4px;--photo-border:4px}.studio-page *{box-sizing:border-box}.studio-page{margin:0;background:var(--bg);color:var(--text);font:13px 'DM Sans',sans-serif;-webkit-font-smoothing:antialiased}.studio-page button,.studio-page input{font:inherit}.studio-page button,.studio-page a,.studio-page input{ -webkit-tap-highlight-color:transparent}.studio-page button{cursor:pointer;background:none;border:1px solid transparent;color:inherit;border-radius:7px}.studio-page button:hover{background:#ffffff0b}.studio-page button:focus-visible,.studio-page a:focus-visible,.studio-page input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}.studio-page button:disabled{opacity:.3;cursor:default}.studio-page a{color:inherit;text-decoration:none}.studio-page .topbar{height:66px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:0 28px;gap:20px}.studio-page .brand{display:flex;align-items:center;gap:10px;font-size:19px;letter-spacing:-.7px;font-weight:600}.studio-page .brand-icon{font-size:34px;font-weight:400;color:var(--accent)}.studio-page .beta{font-size:8px;letter-spacing:1.5px;border:1px solid #50514b;padding:4px 6px;border-radius:4px;margin-left:4px;color:var(--muted)}.studio-page nav{display:flex;background:#131413;border:1px solid #323430;border-radius:8px;padding:3px}.studio-page nav button{padding:9px 17px;color:var(--muted);font-size:12px}.studio-page nav button.selected{background:#353832;color:#f3f1e9;box-shadow:0 2px 4px #0004}.studio-page .top-actions{display:flex;align-items:center;gap:22px}.studio-page .local-label{font-size:11px;color:var(--muted)}.studio-page .local-label i{display:inline-block;width:5px;height:5px;background:#a5b79d;border-radius:50%;margin-right:6px}.studio-page .primary{background:var(--accent);color:#22231f;padding:11px 19px;font-weight:600}.studio-page .primary:hover{background:#f1cfaf}.studio-page main{max-width:1800px;margin:auto}.studio-page .intro{min-height:134px;display:flex;align-items:center;gap:44px;padding:22px 30px}.studio-page .eyebrow{font-size:9px;letter-spacing:2px;color:var(--muted)}.studio-page #heading{font:42px/1.1 'Instrument Serif',Georgia,serif;margin:8px 0 0;font-weight:400;letter-spacing:-.5px}.studio-page #heading em{color:var(--accent);font-weight:400}.studio-page .intro>p{line-height:1.75;color:var(--muted);font-size:12px;margin:19px 0 0}.studio-page .compare{margin-left:auto;align-self:flex-end;font-size:10px;color:var(--muted);padding-bottom:8px}.studio-page .studio{display:grid;grid-template-columns:180px minmax(0,1fr) 264px;border-block:1px solid var(--line);min-height:660px}.studio-page .view-panel{padding:21px 13px 14px;border-right:1px solid var(--line);display:flex;flex-direction:column}.studio-page .panel-heading{display:flex;align-items:center;justify-content:space-between;font-size:9px;letter-spacing:1.5px;color:var(--muted);font-weight:650;margin-bottom:15px}.studio-page .panel-heading>span{font-size:9px;color:#6c726c;letter-spacing:.5px}.studio-page .panel-heading button{font-size:20px;line-height:12px;padding:0 4px}.studio-page .view-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px 8px}.studio-page .view-option{padding:0;text-align:left;border-radius:8px;position:relative}.studio-page .view-option .mini{height:77px;background:#121312;position:relative;border:1px solid #31332f;border-radius:8px;overflow:hidden;transition:border-color .2s}.studio-page .view-option.active .mini{border-color:var(--accent)}.studio-page .view-option.active::after{content:'';position:absolute;right:6px;top:6px;background:var(--accent);border:2px solid #161816;width:5px;height:5px;border-radius:50%}.studio-page .view-option>span{display:block;font-size:10px;margin:8px 1px 0;color:#a4aaa0;white-space:nowrap}.studio-page .view-option.active>span{color:var(--accent)}.studio-page .mini i{width:20px;height:15px;position:absolute;background:#65695e;top:30px;left:27px;border-radius:2px;border:1px solid #96978d;transition:transform .7s cubic-bezier(.22,1,.36,1);background-size:cover;background-position:center}.studio-page .view-option:hover .mini i{filter:brightness(1.35);translate:0 -2px}.studio-page .left-note{margin-top:auto;padding:32px 3px 20px;color:#737b70}.studio-page .left-note>span{font-size:8px;letter-spacing:1.5px;line-height:1.7}.studio-page .left-note p{font:italic 20px/1.2 'Instrument Serif',Georgia,serif;color:#aeb1a5}.studio-page .text-button{font-size:10px;color:var(--muted);padding:12px 0;text-align:left}.studio-page .main-panel{min-width:0;display:flex;flex-direction:column;background:#191a19}.studio-page .canvas-toolbar{height:49px;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-bottom:1px solid var(--line);font-size:10px;gap:8px}.studio-page .canvas-toolbar>div{display:flex;align-items:center;gap:10px}.studio-page .canvas-toolbar strong{font-size:11px;font-weight:500}.studio-page .canvas-toolbar span{color:#8e958b}.studio-page .small-dot{font-size:16px}.studio-page .prototype{font-size:8px;letter-spacing:1px}.studio-page .icon-button{font-size:18px;min-width:30px;height:32px;line-height:1}.studio-page .viewport{padding:20px;flex:1;display:flex;align-items:center;justify-content:center;min-height:540px;background-image:radial-gradient(#ffffff11 1px,transparent 1px);background-size:20px 20px}.studio-page .stage{background:var(--stage);height:100%;min-height:500px;width:100%;position:relative;overflow:hidden;border:1px solid #373935;border-radius:13px;isolation:isolate;touch-action:pan-y;transition:background .4s,width .6s;outline:none!important}.studio-page .stage:focus-visible{box-shadow:0 0 0 2px var(--accent)}.studio-page .stage.light{color:#343b32}.studio-page .stage::before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse at 50% 45%,#ffffff05,transparent 66%)}.studio-page .stage-label,.studio-page .stage-bottom{position:absolute;left:24px;right:24px;display:flex;justify-content:space-between;z-index:5;pointer-events:none;color:#939a8e;font-size:8px;letter-spacing:1.4px}.studio-page .stage-label{top:22px}.studio-page .stage-label>span:last-child{font-size:7px;letter-spacing:1px;opacity:.65}.studio-page .stage-bottom{bottom:20px;letter-spacing:.3px;font-size:9px}.studio-page .stage.light .stage-label,.studio-page .stage.light .stage-bottom{color:#737769}.studio-page .scene{position:absolute;inset:0;perspective:1100px;transform-style:preserve-3d;cursor:grab}.studio-page .scene.dragging{cursor:grabbing}.studio-page .photo-card{position:absolute;left:50%;top:50%;padding:0;width:140px;height:100px;will-change:transform;transform-origin:center center;backface-visibility:hidden;border-radius:var(--corner);background:var(--paper);box-shadow:0 9px 24px #0006;overflow:hidden;border:var(--photo-border) solid var(--paper);transition:border-radius .2s,border-width .2s;touch-action:pan-y}.studio-page .photo-card>img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;transition:filter .2s}.studio-page .photo-card:hover>img{filter:brightness(1.13)}.studio-page .photo-card:focus-visible{outline-offset:3px}.studio-page .center-title{pointer-events:none;position:absolute;left:50%;top:47%;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;text-align:center;z-index:0;white-space:nowrap;transition:opacity .4s}.studio-page .center-title>span{font-size:7px;letter-spacing:3px;color:#92998a}.studio-page .center-title>strong{font:100px/.98 'Instrument Serif',Georgia,serif;font-weight:400;letter-spacing:-4px;margin:6px 0 10px}.studio-page .center-title>em{font:italic 22px 'Instrument Serif',Georgia,serif;color:#b1b9a5}.studio-page .light .center-title>em{color:#707863}.studio-page .transport{display:flex;align-items:center;gap:13px;height:58px;padding:0 22px;border-top:1px solid var(--line)}.studio-page .play{width:34px;height:34px;background:#2d302b;font-size:15px}.studio-page .transport input{flex:1;min-width:30px}.studio-page .transport>span{font:9px ui-monospace,monospace;color:#8d9686;white-space:nowrap;min-width:78px}.studio-page input[type=range]{height:3px;accent-color:var(--accent);cursor:pointer;appearance:none;background:#454a40;border-radius:3px;outline-offset:8px}.studio-page input[type=range]::-webkit-slider-thumb{appearance:none;background:var(--accent);width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 3px #141515}.studio-page input[type=range]::-moz-range-thumb{background:var(--accent);width:10px;height:10px;border:0;border-radius:50%}.studio-page .stage-tabs{height:43px;display:flex;justify-content:center;align-items:center;gap:9px;border-top:1px solid #30322e}.studio-page .stage-tabs button{font-size:10px;color:#89917f;padding:5px 11px;border-radius:20px}.studio-page .stage-tabs button.selected{border-color:#6f785f;color:#c5cfb7}.studio-page .stage-tabs>span{font-size:8px;margin-left:9px;color:#71796a}.studio-page .settings{border-left:1px solid var(--line);height:100%;max-height:760px;overflow:auto;background:var(--panel);scrollbar-width:thin;scrollbar-color:#444a3f transparent}.studio-page .settings-top{display:flex;justify-content:space-between;align-items:center;padding:19px 19px 0;font-size:9px;letter-spacing:1.6px;color:#a4aa9b}.studio-page .settings-top button{display:none}.studio-page .settings section{padding:22px 19px;border-bottom:1px solid var(--line)}.studio-page .ratios{display:flex;gap:8px;justify-content:space-between}.studio-page .ratios button{display:flex;flex:1;align-items:center;flex-direction:column;gap:9px;font-size:9px;color:#8f9687;padding:11px 5px;border:1px solid #363c32}.studio-page .ratios button[aria-pressed=true]{border-color:#afbc9d;color:#d1dcc4;background:#c9dbac08}.studio-page .ratios i{display:block;height:17px;border:1px solid currentColor;border-radius:2px}.studio-page .ratios .wide{width:25px}.studio-page .ratios .square{width:17px}.studio-page .ratios .portrait{width:14px}.studio-page .thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.studio-page .thumbs button{padding:0;border-radius:3px;overflow:hidden;aspect-ratio:1.1;opacity:.85}.studio-page .thumbs button:hover{opacity:1}.studio-page .thumbs img{width:100%;height:100%;object-fit:cover;display:block}.studio-page .helper{color:#838c7d;font-size:9px;line-height:1.5;margin:10px 0 0}.studio-page .slider-label{display:flex;justify-content:space-between;margin:18px 0 13px;font-size:10px;color:#aeb4a5}.studio-page .slider-label output{font-size:9px;color:#86917b}.studio-page .settings input[type=range]{width:100%;display:block}.studio-page .setting-row{display:flex;align-items:center;justify-content:space-between;margin-top:23px;font-size:10px;color:#aeb4a5}.studio-page .toggle{width:27px;height:15px;border-radius:20px;background:#555a50;padding:2px}.studio-page .toggle i{display:block;background:#eff2e9;width:9px;height:9px;border-radius:50%;transition:transform .2s}.studio-page .toggle.on{background:#9da68d}.studio-page .toggle.on i{transform:translateX(12px)}.studio-page .field{font-size:10px;color:#959f89;display:block;margin:15px 0}.studio-page .field input{width:100%;padding:10px 9px;border:1px solid #42493b;color:#d5dfc7;background:#191c17;border-radius:5px;margin-top:8px;font-size:11px}.studio-page .swatches{display:flex;align-items:center;gap:8px;margin-top:17px}.studio-page .swatches button{background:var(--swatch);width:20px;height:20px;border-radius:50%;border:1px solid #ffffff22}.studio-page .swatches button.chosen{outline:1px solid #c4d0b3;outline-offset:3px}.studio-page .swatches span{font-size:9px;color:#7e8b70;margin-left:6px}.studio-page .save-panel{padding:20px 19px}.studio-page .save-panel button{width:100%;border-color:#46523b;padding:12px 0;font-size:10px;color:#bdcba9}.studio-page .save-panel p{font-size:8px;line-height:1.6;color:#7c866f;text-align:center}.studio-page .story-footer{display:flex;gap:50px;align-items:center;padding:42px 30px}.studio-page .story-footer>p{font:28px/1.1 'Instrument Serif',Georgia,serif;margin:0 auto 0 0}.studio-page .story-footer>p>em{color:#9faaa1}.studio-page .story-footer>div>span{font-size:8px;letter-spacing:1.3px;color:#929b8c}.studio-page .story-footer>div>p{font-size:10px;color:#767f6f}.studio-page footer{border-top:1px solid var(--line);padding:18px 30px;font-size:8px;letter-spacing:.5px;color:#747d6f;display:flex;justify-content:space-between;gap:14px}.studio-page .mobile-controls{display:none}.studio-page dialog{background:#20241e;color:var(--text);border:1px solid #536048;border-radius:13px;padding:30px;max-width:calc(100vw - 30px)}.studio-page dialog::backdrop{background:#060a07df;backdrop-filter:blur(9px)}.studio-page dialog[open]{animation:dialogIn .3s cubic-bezier(.2,.8,.3,1)}@keyframes dialogIn{from{opacity:0;transform:translateY(10px) scale(.95)}to{opacity:1;transform:none}}.studio-page #photo-dialog{padding:12px;width:720px;background:#171b15}.studio-page #focused-photo{display:block;width:100%;max-height:72vh;object-fit:contain;background:#10120e;border-radius:6px}.studio-page .dialog-close{position:absolute;right:21px;top:21px;width:32px;height:32px;background:#0009;border-radius:50%;z-index:2}.studio-page .photo-meta{padding:14px 8px 3px;display:flex;justify-content:space-between;align-items:center}.studio-page .photo-meta span{font-size:8px;letter-spacing:2px;color:#95a085}.studio-page .photo-meta p{font:24px 'Instrument Serif',Georgia,serif;margin:6px 0}.studio-page .photo-meta button{font-size:24px;padding:10px}.studio-page #info-dialog{width:430px}.studio-page #info-dialog h2{font:40px/1.05 'Instrument Serif',Georgia,serif;margin:20px 0}.studio-page #info-dialog p{color:#a8b19d;font-size:13px;line-height:1.8}.studio-page #info-close{margin-top:14px}.studio-page .toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%,20px);background:#e3e9d9;color:#263020;padding:12px 22px;border-radius:7px;font-size:12px;box-shadow:0 8px 40px #0006;z-index:30;opacity:0;pointer-events:none;transition:.3s;max-width:90vw}.studio-page .toast.visible{opacity:1;transform:translate(-50%,0)}.studio-page .loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:italic 27px 'Instrument Serif',Georgia,serif;color:#a6af9a;background:#141515e8;z-index:6}.studio-page .loading[hidden]{display:none}.studio-page .stage:fullscreen{height:100vh;width:100vw;border:0;border-radius:0}.studio-page .stage[data-view=film] .photo-card{border:0;background:#8c6435;padding:12px 3px 12px}.studio-page .stage[data-view=film] .photo-card::before,.studio-page .stage[data-view=film] .photo-card::after{content:'';position:absolute;height:6px;left:8px;right:8px;top:3px;background:repeating-linear-gradient(90deg,#181c15 0 8px,transparent 8px 16px);border-radius:1px}.studio-page .stage[data-view=film] .photo-card::after{top:auto;bottom:3px}.studio-page .stage[data-view=rain] .photo-card{box-shadow:0 15px 24px #0008}.studio-page .stage[data-view=wall] .photo-card{box-shadow:0 10px 18px #0007}.studio-page #book-mount{position:absolute;inset:35px 0 38px;z-index:2;cursor:grab}.studio-page #book-mount canvas{display:block;width:100%;height:100%;touch-action:pan-y}.studio-page #book-fallback{position:absolute;inset:80px 35px;display:flex;gap:2px;z-index:2;background:#b6b69a;box-shadow:0 20px 50px #0009}.studio-page #book-fallback[hidden]{display:none}.studio-page #book-fallback>div{background:#eee8d9;color:#303725;width:50%;padding:6%;display:flex;flex-direction:column;justify-content:center}.studio-page #book-fallback h2{font:30px 'Instrument Serif',Georgia,serif}.studio-page #book-fallback img{width:100%;object-fit:contain}.studio-page #shelf{position:absolute;inset:75px 12% 90px;display:flex;justify-content:center;align-items:flex-end;gap:22px;perspective:1000px;border-bottom:10px solid #363f2e;box-shadow:0 25px 26px -20px #000;padding:0 12px 7px}.studio-page #shelf[hidden]{display:none}.studio-page .shelf-book{width:28%;height:70%;position:relative;transform-style:preserve-3d;transform:rotateY(-26deg) rotateZ(-1deg);transition:transform .65s cubic-bezier(.2,.8,.2,1);box-shadow:14px 15px 24px #0006;border-radius:2px 5px 5px 2px;border-left:10px solid #0003;padding:20px 12px;text-align:left;background:#657b70;display:flex;flex-direction:column;gap:12px}.studio-page .shelf-book:nth-child(2){background:#927d60;height:80%;transform:rotateY(-20deg) rotateZ(2deg)}.studio-page .shelf-book:nth-child(3){background:#77625d;height:75%;transform:rotateY(-28deg)}.studio-page .shelf-book::after{content:'';position:absolute;right:-7px;top:5px;bottom:5px;width:7px;background:repeating-linear-gradient(0deg,#c9c4b7 0 1px,#faf4e7 1px 3px);transform:rotateY(50deg);transform-origin:left}.studio-page .shelf-book:hover,.studio-page .shelf-book:focus-visible{transform:rotateY(-5deg) translateY(-22px) rotateZ(0)}.studio-page .shelf-book img{width:100%;height:44%;object-fit:cover;margin-top:auto;pointer-events:none}.studio-page .shelf-book strong{font:27px/1 'Instrument Serif',Georgia,serif;font-weight:400}.studio-page .shelf-book small{font-size:7px;letter-spacing:2px}.studio-page .shelf-book .year{font-size:9px;letter-spacing:2px}.studio-page .book-caption{color:#838f75;font-size:9px}.studio-page .film-label{position:absolute;inset:auto 0 70px;text-align:center;font:italic 26px 'Instrument Serif',Georgia,serif;color:#b9c3a6;pointer-events:none}
@media(min-width:1500px){.studio-page .studio{grid-template-columns:204px minmax(0,1fr) 290px}.studio-page .view-option .mini{height:91px}.studio-page .viewport{min-height:600px}.studio-page .stage{min-height:560px}.studio-page .settings{max-height:810px}.studio-page .center-title>strong{font-size:120px}.studio-page .photo-card{width:155px;height:110px}}
@media(max-width:1150px){.studio-page .studio{grid-template-columns:142px minmax(0,1fr) 230px}.studio-page .view-panel{padding-inline:10px}.studio-page .view-option .mini{height:60px}.studio-page .view-option>span{font-size:9px}.studio-page .mini i{left:17px;top:23px}.studio-page .viewport{padding:12px}.studio-page .settings section{padding:19px 14px}.studio-page .intro{gap:28px}.studio-page .intro>p{font-size:11px}.studio-page .compare{display:none}.studio-page .prototype{display:none}.studio-page .center-title>strong{font-size:80px}.studio-page .photo-card{width:120px;height:85px}.studio-page .story-footer{gap:24px}.studio-page .shelf-book strong{font-size:20px}}
@media(max-width:820px){.studio-page .topbar{height:60px;padding:0 17px}.studio-page .brand{font-size:16px}.studio-page .brand-icon{font-size:29px}.studio-page .beta,.studio-page .local-label{display:none}.studio-page .top-actions{gap:0}.studio-page .primary{padding:10px 13px;font-size:11px}.studio-page nav button{padding:8px 10px;font-size:10px}.studio-page .intro{min-height:114px;padding:22px 18px}.studio-page .intro>p{display:none}.studio-page #heading{font-size:36px}.studio-page .studio{grid-template-columns:118px minmax(0,1fr)}.studio-page .settings{display:none}.studio-page .viewport{min-height:540px}.studio-page .view-option .mini{height:77px}.studio-page .view-grid{grid-template-columns:1fr}.studio-page .mini i{left:36px;top:29px}.studio-page .view-panel{max-height:700px;overflow:auto}.studio-page .left-note{display:none}.studio-page .mobile-controls{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid var(--line)}.studio-page .mobile-controls button{background:#303a29;padding:10px 16px;font-size:12px}.studio-page .mobile-controls span{font-size:10px;color:#859475}.studio-page .settings.open{display:block;position:fixed;inset:auto 0 0;max-height:78dvh;width:100%;z-index:20;box-shadow:0 -10px 100px #000c;border:1px solid #58664b;border-radius:18px 18px 0 0}.studio-page .settings-top{position:sticky;top:0;background:var(--panel);padding:16px 20px;z-index:2}.studio-page .settings-top button{display:block}.studio-page .settings.open section{padding:20px 28px}.studio-page .settings.open .thumbs{grid-template-columns:repeat(8,1fr)}.studio-page .story-footer{flex-wrap:wrap;gap:22px;padding:35px 20px}.studio-page .story-footer>p{flex-basis:100%}.studio-page .story-footer>div{flex:1}.studio-page .story-footer>div>p{font-size:9px}.studio-page footer{padding:16px 20px;line-height:1.6}.studio-page footer span{display:none}}
@media(max-width:540px){.studio-page .topbar{flex-wrap:wrap;height:102px;padding:12px 17px;gap:9px}.studio-page .brand{order:0}.studio-page .top-actions{order:1}.studio-page nav{order:2;width:100%}.studio-page nav button{flex:1;padding:7px}.studio-page .intro{padding:21px 17px;min-height:110px}.studio-page #heading{font-size:32px}.studio-page .eyebrow{font-size:8px}.studio-page .studio{display:flex;flex-direction:column}.studio-page .view-panel{padding:12px 10px;border:0;border-bottom:1px solid var(--line);overflow:auto}.studio-page .view-panel>.panel-heading,.studio-page .text-button{display:none}.studio-page .view-grid{display:flex;gap:10px;width:max-content}.studio-page .view-option{width:65px;flex-shrink:0}.studio-page .view-option .mini{height:49px}.studio-page .view-option>span{font-size:9px;margin-top:6px;text-align:center}.studio-page .mini i{left:23px;top:17px;width:16px;height:11px}.studio-page .canvas-toolbar{height:41px;padding:0 14px}.studio-page .canvas-toolbar strong{font-size:10px}.studio-page .viewport{min-height:420px;padding:10px}.studio-page .stage{min-height:400px;height:400px}.studio-page .stage-label,.studio-page .stage-bottom{left:13px;right:13px;font-size:7px}.studio-page .stage-label{top:15px}.studio-page .stage-label>span:last-child{font-size:6px}.studio-page .stage-bottom{bottom:14px}.studio-page .stage-bottom>span:last-child{display:none}.studio-page .center-title>strong{font-size:75px}.studio-page .center-title>em{font-size:18px}.studio-page .center-title>span{font-size:6px;letter-spacing:2px}.studio-page .transport{padding:0 13px;gap:8px;height:53px}.studio-page .transport>span{min-width:60px;font-size:8px}.studio-page .transport .icon-button{min-width:24px}.studio-page .stage-tabs{height:40px;gap:4px}.studio-page .stage-tabs>span{font-size:7px;margin-left:2px}.studio-page .stage-tabs button{padding:4px 9px;font-size:9px}.studio-page .photo-card{width:108px;height:77px}.studio-page .mobile-controls{padding:12px 15px}.studio-page .mobile-controls span{font-size:9px}.studio-page .story-footer>p{font-size:28px}.studio-page .story-footer>div>span{font-size:7px;letter-spacing:.7px}.studio-page #shelf{inset:70px 7% 80px;gap:10px}.studio-page .shelf-book{padding:12px 6px;border-left-width:5px}.studio-page .shelf-book strong{font-size:18px}.studio-page .shelf-book small{font-size:6px}.studio-page .settings.open .thumbs{grid-template-columns:repeat(6,1fr)}.studio-page #book-mount{inset:50px 0}.studio-page #photo-dialog{padding:8px}.studio-page .photo-meta p{font-size:21px}.studio-page .photo-meta button{padding:6px}.studio-page .photo-meta>div:last-child{white-space:nowrap}}
@media(prefers-reduced-motion:reduce){.studio-page *,.studio-page *::before,.studio-page *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}/* Motion study refinements: orbital guides and readable compact controls. */
.studio-page .stage[data-view=atlas] .scene{background:radial-gradient(ellipse at center,transparent 0 30%,#b4bf9c0b 30.2% 30.5%,transparent 30.7% 48%,#b4bf9c0c 48.2% 48.5%,transparent 48.7% 66%,#b4bf9c0d 66.2% 66.5%,transparent 66.7%)}.studio-page .panel-heading,.studio-page .settings-top{font-size:10px}.studio-page .slider-label,.studio-page .setting-row,.studio-page .field{font-size:11px}.studio-page .view-option>span{font-size:11px}.studio-page .stage:fullscreen{width:100vw!important;height:100vh!important;max-width:none!important}
@media(max-width:1150px){.studio-page .view-option>span{font-size:9px}}
@media(max-width:540px){.studio-page .viewport{min-height:0}.studio-page .settings.open .field,.studio-page .settings.open .slider-label{font-size:13px}.studio-page .settings.open .panel-heading{font-size:11px}}/* Clearer imagery and an always-visible compact style picker. */
.studio-page .photo-card.portrait-photo{width:100px;height:140px}.studio-page .photo-card.portrait-photo>img{object-fit:contain}.studio-page .view-panel,.studio-page .view-grid{scrollbar-width:none}.studio-page .view-panel::-webkit-scrollbar,.studio-page .view-grid::-webkit-scrollbar{display:none}.studio-page .stage-tabs[hidden]{display:none}.studio-page .photo-credit{font:10px/1.65 'DM Sans',sans-serif!important;color:#9ca392;margin-top:8px!important;max-width:520px}.studio-page .photo-credit a,.studio-page footer a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:820px){.studio-page .view-panel{max-height:none;overflow:visible}.studio-page .view-option{min-height:44px}}
@media(max-width:540px){.studio-page .view-panel{overflow:visible;padding:12px 12px 10px}.studio-page .view-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 8px;width:100%}.studio-page .view-option{width:100%;min-width:0}.studio-page .view-option .mini{height:42px}.studio-page .view-option>span{font-size:10px;white-space:normal;line-height:1.2;margin-top:5px}.studio-page .mini i{left:calc(50% - 8px);top:15px}.studio-page .intro{min-height:86px;padding:17px}.studio-page .eyebrow{font-size:7px;letter-spacing:1.5px}.studio-page #heading{font-size:30px}.studio-page .photo-card.portrait-photo{width:76px;height:106px}.studio-page .transport .icon-button,.studio-page .play{min-width:36px;min-height:40px}.studio-page .transport>span{font-size:8px;min-width:56px}.studio-page .photo-meta{gap:10px;align-items:flex-start}.studio-page .photo-meta>div:first-child{min-width:0}.studio-page .photo-credit{font-size:9px!important}.studio-page .settings.open input[type=range]{height:6px;margin:20px 0}.studio-page .settings.open input[type=range]::-webkit-slider-thumb{width:18px;height:18px}.studio-page .settings.open .ratios button{min-height:65px}.studio-page .canvas-toolbar>div{min-width:0}.studio-page .canvas-toolbar strong{max-width:155px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}.studio-page .shelf-book.preview-active{transform:rotateY(-8deg) translateY(-16px) rotateZ(0)}
@media(prefers-reduced-motion:reduce){.studio-page .shelf-book.preview-active{transform:rotateY(-26deg)}}
@media(max-width:540px){.studio-page .studio{min-height:0}.studio-page .loading{padding:24px;text-align:center;font-size:22px;line-height:1.3}.studio-page .photo-meta button{min-width:40px;min-height:44px}}

/* ---------------------------------------------------------------------------
 * Reordering, and the line under a photograph.
 *
 * Added after the study: the order the collection is in is now something the
 * user decides, and a photograph can carry a sentence. Both are written in the
 * study's own vocabulary — the accent for what is being moved, the serif for
 * words — rather than introducing a second look.
 * ------------------------------------------------------------------------ */
.studio-page .thumbs button{cursor:grab;touch-action:none}
.studio-page .thumbs button:active{cursor:grabbing}
.studio-page .thumbs button.lifted{opacity:.45;outline:1px solid var(--accent);outline-offset:2px}
.studio-page #photo-caption{font:24px 'Instrument Serif',Georgia,serif;color:var(--text);background:none;border:0;border-bottom:1px solid transparent;padding:4px 0;margin:6px 0;width:100%;max-width:460px}
.studio-page #photo-caption::placeholder{color:#7f8a76}
.studio-page #photo-caption:focus{outline:none;border-bottom-color:var(--accent)}
.studio-page #photo-caption:disabled{color:#95a085;cursor:default}
.studio-page #see-example{margin-right:2px;white-space:nowrap}
.studio-page #caption-hint{font-size:9px;color:#7c866f;margin:0}

/* The newborn page's own fields, in the panel's existing vocabulary. */
.studio-page .field-row{display:flex;gap:10px}
.studio-page .field-row .field{flex:1;min-width:0}
.studio-page .field textarea{width:100%;padding:10px 9px;border:1px solid #42493b;color:#d5dfc7;background:#191c17;border-radius:5px;margin-top:8px;font:11px 'DM Sans',sans-serif;line-height:1.6;resize:vertical}
.studio-page .field input[type=date],.studio-page .field input[type=time]{color-scheme:dark}
.studio-page .milestone .field{margin:9px 0}


/* ---------------------------------------------------------------------------
 * Light mode.
 *
 * The site shipped with one palette answering to both themes, so the switch
 * did nothing. This is the same design in daylight rather than a second one:
 * every shade below is the dark theme's own value with its lightness flipped,
 * generated rather than hand-picked so nothing drifts. The handful that carry
 * meaning instead of merely being dark — the paper a photograph is mounted on,
 * the accent, the stage — are set deliberately just below.
 *
 * Shadows and scrims keep their alpha blacks: light has shadows too.
 * ------------------------------------------------------------------------ */
html.studio-light{--bg:#f2ece1;--panel:#e9e2d4;--line:#d3cab8;--muted:#5e6356;--text:#23261f;--accent:#8a5a2b;--stage:#e6dfd0;--paper:#fffdf8}
html.studio-light .studio-page .beta{border:1px solid #b9b3a9}html.studio-light .studio-page nav{background:#d6d2cd;border:1px solid #d2cec8}html.studio-light .studio-page nav button.selected{background:#cfcbc5;color:#16140c}html.studio-light .studio-page .local-label i{background:#506248}html.studio-light .studio-page .primary{color:#d6d2cd}html.studio-light .studio-page .primary:hover{background:#502e0e}html.studio-light .studio-page .panel-heading>span{color:#9b9285}html.studio-light .studio-page .view-option .mini{background:#d6d2cd;border:1px solid #d3cfc9}html.studio-light .studio-page .view-option.active::after{border:2px solid #d6d2cd}html.studio-light .studio-page .view-option>span{color:#635c51}html.studio-light .studio-page .mini i{background:#a59d92;border:1px solid #786f62}html.studio-light .studio-page .left-note{color:#958c7e}html.studio-light .studio-page .left-note p{color:#5c564c}html.studio-light .studio-page .main-panel{background:#d6d2cd}html.studio-light .studio-page .canvas-toolbar span{color:#7a7164}html.studio-light .studio-page .stage{border:1px solid #cec9c2}html.studio-light .studio-page .stage.light{color:#cecac3}html.studio-light .studio-page .stage-label,html.studio-light .studio-page .stage-bottom{color:#766d60}html.studio-light .studio-page .stage.light .stage-label,html.studio-light .studio-page .stage.light .stage-bottom{color:#9a9184}html.studio-light .studio-page .center-title>span{color:#787063}html.studio-light .studio-page .center-title>em{color:#525a46}html.studio-light .studio-page .light .center-title>em{color:#9c9487}html.studio-light .studio-page .play{background:#d6d2cd}html.studio-light .studio-page .transport>span{color:#7c7366}html.studio-light .studio-page input[type=range]{background:#c1bbb3}html.studio-light .studio-page .stage-tabs{border-top:1px solid #d4d0ca}html.studio-light .studio-page .stage-tabs button{color:#83796b}html.studio-light .studio-page .stage-tabs button.selected{border-color:#9e9689;color:#3e4830}html.studio-light .studio-page .stage-tabs>span{color:#999082}html.studio-light .studio-page .settings-top{color:#665e53}html.studio-light .studio-page .ratios button{color:#7c7365;border:1px solid #cec9c2}html.studio-light .studio-page .ratios button[aria-pressed=true]{border-color:#556243;color:#303b23}html.studio-light .studio-page .helper{color:#877d6e}html.studio-light .studio-page .slider-label{color:#5b544a}html.studio-light .studio-page .slider-label output{color:#857b6d}html.studio-light .studio-page .setting-row{color:#5b544a}html.studio-light .studio-page .toggle{background:#b2aca2}html.studio-light .studio-page .toggle i{background:#13160d}html.studio-light .studio-page .toggle.on{background:#697259}html.studio-light .studio-page .field{color:#766d60}html.studio-light .studio-page .field input{border:1px solid #c4beb6;color:#2e3820;background:#d6d2cd}html.studio-light .studio-page .swatches button.chosen{outline:1px solid #404c2f}html.studio-light .studio-page .swatches span{color:#8e8475}html.studio-light .studio-page .save-panel button{border-color:#b8c4ad;color:#485634}html.studio-light .studio-page .save-panel p{color:#918778}html.studio-light .studio-page .story-footer>p>em{color:#645c51}html.studio-light .studio-page .story-footer>div>span{color:#766e61}html.studio-light .studio-page .story-footer>div>p{color:#948a7c}html.studio-light .studio-page footer{color:#958b7d}html.studio-light .studio-page dialog{background:#d6d2cd;border:1px solid #aab79f}html.studio-light .studio-page #photo-dialog{background:#cfd7cb}html.studio-light .studio-page #focused-photo{background:#d1d7cb}html.studio-light .studio-page .photo-meta span{color:#6f7a5f}html.studio-light .studio-page #info-dialog p{color:#615a4f}html.studio-light .studio-page .toast{background:#202616;color:#cfdac8}html.studio-light .studio-page .loading{color:#645c51}html.studio-light .studio-page .stage[data-view=film] .photo-card{background:#caa273}html.studio-light .studio-page .stage[data-view=film] .photo-card::before,html.studio-light .studio-page .stage[data-view=film] .photo-card::after{background:repeating-linear-gradient(90deg,#d0d8cb 0 8px,transparent 8px 16px)}html.studio-light .studio-page #book-fallback{background:#656549}html.studio-light .studio-page #book-fallback>div{background:#262011;color:#d3dac8}html.studio-light .studio-page #shelf{border-bottom:10px solid #c8d1c0}html.studio-light .studio-page .shelf-book{background:#9a9184}html.studio-light .studio-page .shelf-book:nth-child(2){background:#9f8a6d}html.studio-light .studio-page .shelf-book:nth-child(3){background:#a28d88}html.studio-light .studio-page .shelf-book::after{background:repeating-linear-gradient(0deg,#484336 0 1px,#181205 1px 3px)}html.studio-light .studio-page .book-caption{color:#8a8070}html.studio-light .studio-page .film-label{color:#4f593c}@media(max-width:820px){html.studio-light .studio-page .mobile-controls button{background:#ccd6c5}html.studio-light .studio-page .mobile-controls span{color:#7b8a6b}html.studio-light .studio-page .settings.open{border:1px solid #a6b499}}html.studio-light .studio-page .photo-credit{color:#6f675a}html.studio-light .studio-page #photo-caption::placeholder{color:#8c8272}html.studio-light .studio-page #photo-caption:disabled{color:#6f7a5f}html.studio-light .studio-page #caption-hint{color:#918778}html.studio-light .studio-page .field textarea{border:1px solid #c4beb6;color:#2e3820;background:#d6d2cd}html.studio-light html.studio-light .studio-page .beta{border:1px solid #565046}html.studio-light html.studio-light .studio-page nav{background:#332f29;border:1px solid #37332d}html.studio-light html.studio-light .studio-page nav button.selected{background:#3a3630;color:#dfd9c4}html.studio-light html.studio-light .studio-page .local-label i{background:#a5b79d}html.studio-light html.studio-light .studio-page .primary{color:#332f29}html.studio-light html.studio-light .studio-page .primary:hover{background:#f1cfaf}html.studio-light html.studio-light .studio-page .panel-heading>span{color:#7a7164}html.studio-light html.studio-light .studio-page .view-option .mini{background:#332f29;border:1px solid #36322c}html.studio-light html.studio-light .studio-page .view-option.active::after{border:2px solid #332f29}html.studio-light html.studio-light .studio-page .view-option>span{color:#aea79c}html.studio-light html.studio-light .studio-page .mini i{background:#6d655a;border:1px solid #9d9487}html.studio-light html.studio-light .studio-page .left-note{color:#81786a}html.studio-light html.studio-light .studio-page .left-note p{color:#b3ada3}html.studio-light html.studio-light .studio-page .main-panel{background:#332f29}html.studio-light html.studio-light .studio-page .canvas-toolbar span{color:#9b9285}html.studio-light html.studio-light .studio-page .stage{border:1px solid #3d3832}html.studio-light html.studio-light .studio-page .stage.light{color:#3c3831}html.studio-light html.studio-light .studio-page .stage-label,html.studio-light html.studio-light .studio-page .stage-bottom{color:#9f9689}html.studio-light html.studio-light .studio-page .stage.light .stage-label,html.studio-light html.studio-light .studio-page .stage.light .stage-bottom{color:#7b7265}html.studio-light html.studio-light .studio-page .center-title>span{color:#9c9487}html.studio-light html.studio-light .studio-page .center-title>em{color:#b1b9a5}html.studio-light html.studio-light .studio-page .light .center-title>em{color:#787063}html.studio-light html.studio-light .studio-page .play{background:#322e29}html.studio-light html.studio-light .studio-page .transport>span{color:#999083}html.studio-light html.studio-light .studio-page input[type=range]{background:#4c463e}html.studio-light html.studio-light .studio-page .stage-tabs{border-top:1px solid #35312b}html.studio-light html.studio-light .studio-page .stage-tabs button{color:#948a7c}html.studio-light html.studio-light .studio-page .stage-tabs button.selected{border-color:#766e61;color:#c5cfb7}html.studio-light html.studio-light .studio-page .stage-tabs>span{color:#7d7466}html.studio-light html.studio-light .studio-page .settings-top{color:#aca499}html.studio-light html.studio-light .studio-page .ratios button{color:#9a9183;border:1px solid #3d3832}html.studio-light html.studio-light .studio-page .ratios button[aria-pressed=true]{border-color:#afbc9d;color:#d1dcc4}html.studio-light html.studio-light .studio-page .helper{color:#918778}html.studio-light html.studio-light .studio-page .slider-label{color:#b5aea4}html.studio-light html.studio-light .studio-page .slider-label output{color:#92887a}html.studio-light html.studio-light .studio-page .setting-row{color:#b5aea4}html.studio-light html.studio-light .studio-page .toggle{background:#5e574c}html.studio-light html.studio-light .studio-page .toggle i{background:#d5ddc5}html.studio-light html.studio-light .studio-page .toggle.on{background:#9da68d}html.studio-light html.studio-light .studio-page .field{color:#9f9689}html.studio-light html.studio-light .studio-page .field input{border:1px solid #49433b;color:#d3dec5;background:#322e29}html.studio-light html.studio-light .studio-page .swatches button.chosen{outline:1px solid #c4d0b3}html.studio-light html.studio-light .studio-page .swatches span{color:#8a8071}html.studio-light html.studio-light .studio-page .save-panel button{border-color:#46523b;color:#bdcba9}html.studio-light html.studio-light .studio-page .save-panel p{color:#877d6e}html.studio-light html.studio-light .studio-page .story-footer>p>em{color:#aea69b}html.studio-light html.studio-light .studio-page .story-footer>div>span{color:#9e9689}html.studio-light html.studio-light .studio-page .story-footer>div>p{color:#83796b}html.studio-light html.studio-light .studio-page footer{color:#82786a}html.studio-light html.studio-light .studio-page dialog{background:#332f29;border:1px solid #536048}html.studio-light html.studio-light .studio-page #photo-dialog{background:#2c3428}html.studio-light html.studio-light .studio-page #focused-photo{background:#2e3428}html.studio-light html.studio-light .studio-page .photo-meta span{color:#95a085}html.studio-light html.studio-light .studio-page #info-dialog p{color:#b0a99e}html.studio-light html.studio-light .studio-page .toast{background:#d4ddc5;color:#2c3725}html.studio-light html.studio-light .studio-page .loading{color:#aea69b}html.studio-light html.studio-light .studio-page .stage[data-view=film] .photo-card{background:#8c6435}html.studio-light html.studio-light .studio-page .stage[data-view=film] .photo-card::before,html.studio-light html.studio-light .studio-page .stage[data-view=film] .photo-card::after{background:repeating-linear-gradient(90deg,#2c3427 0 8px,transparent 8px 16px)}html.studio-light html.studio-light .studio-page #book-fallback{background:#b6b69a}html.studio-light html.studio-light .studio-page #book-fallback>div{background:#e3d9c0;color:#303725}html.studio-light html.studio-light .studio-page #shelf{border-bottom:10px solid #363f2e}html.studio-light html.studio-light .studio-page .shelf-book{background:#7b7265}html.studio-light html.studio-light .studio-page .shelf-book:nth-child(2){background:#927d60}html.studio-light html.studio-light .studio-page .shelf-book:nth-child(3){background:#77625d}html.studio-light html.studio-light .studio-page .shelf-book::after{background:repeating-linear-gradient(0deg,#c9c4b7 0 1px,#efdcb3 1px 3px)}html.studio-light html.studio-light .studio-page .book-caption{color:#8e8476}html.studio-light html.studio-light .studio-page .film-label{color:#b9c3a6}@media(max-width:820px){html.studio-light html.studio-light .studio-page .mobile-controls button{background:#303a29}html.studio-light html.studio-light .studio-page .mobile-controls span{color:#859475}html.studio-light html.studio-light .studio-page .settings.open{border:1px solid #58664b}}html.studio-light html.studio-light .studio-page .photo-credit{color:#a59d90}html.studio-light html.studio-light .studio-page #photo-caption::placeholder{color:#8d8373}html.studio-light html.studio-light .studio-page #photo-caption:disabled{color:#95a085}html.studio-light html.studio-light .studio-page #caption-hint{color:#877d6e}html.studio-light html.studio-light .studio-page .field textarea{border:1px solid #49433b;color:#d3dec5;background:#322e29}


/* Saved books share the existing shelf; actions stay readable above the spines. */
.studio-page #shelf{justify-content:flex-start;overflow-x:auto;overflow-y:hidden;padding-top:54px}
.studio-page #shelf .shelf-actions{position:sticky;left:0;top:0;align-self:flex-start;flex:0 0 100%;height:44px;display:flex;align-items:center;gap:6px;z-index:4;white-space:nowrap}
.studio-page #shelf .shelf-actions button,.studio-page #shelf .shelf-actions a{font-size:10px;padding:7px 8px;border:1px solid #696f66;border-radius:4px;background:#272b27;color:#e8e9e2}
.studio-page #shelf .shelf-book{flex:0 0 min(28%,170px);height:68%;min-width:120px}
.studio-page #shelf #cloud-books{position:absolute;inset:0;background:#202520ed;color:#e8e9e2;overflow:auto;z-index:5;padding:18px;display:flex;flex-direction:column;align-items:flex-start;gap:9px}
.studio-page #shelf #cloud-books>div{display:flex;gap:8px;align-items:center}
.studio-page #shelf #cloud-books button,.studio-page #shelf #cloud-books a{font-size:11px;padding:8px;border:1px solid #676f63;border-radius:4px}
.studio-page #shelf .shelf-actions{position:absolute;top:8px;left:10px;right:10px;flex:none;width:max-content;max-width:calc(100% - 20px);overflow-x:auto}