:root{--paper:#eeeae0;--ink:#30372d;--olive:#647151;--line:#c9cbbd;--muted:#747b6b;--rose:#955164;--panel:#f7f5ee;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',sans-serif;transition:background .6s}button,input,a{-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}button{cursor:pointer}button{border:0;background:none}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--rose);outline-offset:5px}.paper-grain{position:fixed;inset:0;z-index:8;pointer-events:none;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' opacity='.7' filter='url(%23n)' d='M0 0h160v160H0z'/%3E%3C/svg%3E")}.masthead{height:100px;max-width:1800px;margin:0 auto;padding:0 4.2%;display:flex;align-items:center;justify-content:space-between;position:relative}.masthead:after{content:'';height:1px;background:var(--line);position:absolute;bottom:0;left:4.2%;right:4.2%}.wordmark{font:500 42px 'Playfair Display',Georgia,serif;letter-spacing:-2.3px;display:flex;align-items:flex-start;gap:8px}.wordmark-star{font:24px Georgia;margin-top:7px;color:var(--rose)}.mast-note{font-size:9px;letter-spacing:2.1px;margin-left:-5%}.studio-toggle{display:flex;gap:11px;align-items:center;font-size:11px;padding:12px 0 12px 12px}.studio-toggle>span:last-child{font-size:18px;margin-left:12px}.live-dot{display:inline-block;width:5px;height:5px;border-radius:100%;background:var(--olive)}main{max-width:1800px;padding:0 4.2%;margin:auto}.folio{display:flex;align-items:center;justify-content:space-between;height:63px;font-size:9px;letter-spacing:1.8px;color:var(--muted)}.folio-right{display:flex;gap:18px;align-items:center}.folio-line{width:32px;height:1px;background:var(--line)}.stage{position:relative;height:calc(100svh - 307px);min-height:530px;max-height:960px;isolation:isolate;overflow:hidden}.composition{position:absolute;inset:0;pointer-events:none}.giant-z{position:absolute;font:italic 500 clamp(500px,58vw,950px)/.7 'Playfair Display',Georgia,serif;left:32%;top:-10%;color:#d7dbcb;opacity:.22;transform:rotate(-9deg);user-select:none}.sketch-orbit{position:absolute;left:33%;top:0;height:98%;width:57%;overflow:visible;fill:none;stroke:#8a9479;stroke-width:.7;opacity:.35;transform:rotate(-12deg)}.sketch-orbit path:last-child{opacity:.35;stroke-width:.45}.registration{position:absolute;color:#89947b;font-size:19px;font-weight:400}.reg-one{left:39%;top:5%}.reg-two{left:85%;bottom:10%}.intro-copy{position:absolute;z-index:3;left:3%;top:16%;pointer-events:none}.chapter{display:flex;align-items:center;gap:12px;font-size:8px;letter-spacing:1.4px;color:var(--muted)}.chapter>span:first-child{font-size:11px;color:var(--rose)}.chapter i{height:1px;width:24px;background:var(--line)}h1{font:500 clamp(48px,5.2vw,83px)/1.02 'Playfair Display',Georgia,serif;letter-spacing:-2.9px;margin:29px 0 23px}h1 em{color:var(--olive);font-weight:500;display:inline-block;margin-top:5px;white-space:nowrap}.intro-copy p{font-size:12px;line-height:1.9;color:var(--muted);margin:0}.text-replay{pointer-events:auto;display:flex;align-items:center;gap:11px;margin:25px 0 0;padding:6px 0;font-size:10px;border-bottom:1px solid #a3aa94}.text-replay span{font-size:19px;color:var(--rose);transition:transform .5s}.text-replay:hover span{transform:rotate(-90deg)}canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;touch-action:pan-y}.art-note{position:absolute;z-index:3;pointer-events:none}.note-top{right:1.4%;top:13%;font-size:8px;letter-spacing:1.2px;line-height:1.8;display:flex;gap:13px;color:var(--muted)}.note-top b{font-weight:400;font-size:11px;letter-spacing:0;color:var(--ink)}.note-line{width:30px;height:1px;background:var(--line);margin-top:7px}.note-bottom{right:4%;bottom:11%;transform:rotate(-8deg);display:flex;flex-direction:column;align-items:center;gap:10px}.handwritten{font:italic 500 21px 'Playfair Display',Georgia,serif;color:var(--rose)}.note-bottom svg{width:75px;height:41px;fill:none;stroke:var(--rose);stroke-width:1.2;transform:rotate(165deg)}.color-study{position:absolute;bottom:6%;left:3%;z-index:3}.color-study>span{font-size:7px;letter-spacing:1.5px;color:var(--muted)}.swatches{display:flex;gap:7px;margin-top:12px;align-items:center}.swatches i{display:block;background:var(--swatch);height:15px;width:15px;border-radius:44% 53% 46% 49%;transform:rotate(-15deg)}.swatches i:nth-child(2n){border-radius:50% 40% 45% 42%;transform:rotate(20deg)}.vertical-note{position:absolute;right:0;top:39%;writing-mode:vertical-rl;font-size:7px;letter-spacing:2.2px;color:var(--muted)}#loading{position:absolute;z-index:4;left:65%;top:50%;transform:translate(-50%,-50%);font-size:11px;color:var(--muted);transition:opacity .5s}#loading[hidden]{display:none}.transport{height:82px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:35px}.transport-caption{display:flex;gap:10px;align-items:center;font-size:10px;min-width:210px}.timeline-wrap{display:flex;gap:15px;align-items:center;max-width:460px;flex:1;margin:auto;font-size:9px;font-variant-numeric:tabular-nums;color:var(--muted)}input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:14px;background:transparent;cursor:pointer;margin:0;--fill:0%}input[type=range]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(to right,var(--olive) var(--fill),var(--line) var(--fill))}input[type=range]::-moz-range-track{height:2px;background:var(--line)}input[type=range]::-moz-range-progress{height:2px;background:var(--olive)}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:8px;height:8px;background:var(--olive);border-radius:50%;margin-top:-3px;border:0}input[type=range]::-moz-range-thumb{width:8px;height:8px;border:0;border-radius:50%;background:var(--olive)}.playback{display:flex;gap:13px;align-items:center;margin-left:auto}.playback button{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;transition:background .2s}.playback button:hover{background:#dbe0d0}.playback #replay{font-size:25px}.playback svg{height:19px;width:19px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}footer{height:62px;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:1.3px;color:var(--muted)}footer>span{display:flex;align-items:center;gap:9px}.footer-star{font-size:15px;color:var(--rose)}footer i{font-style:normal;margin:0 3px}.studio{position:fixed;top:0;right:0;bottom:0;width:360px;max-width:100%;background:var(--panel);z-index:12;transform:translateX(102%);transition:transform .45s cubic-bezier(.2,.7,.2,1);box-shadow:-10px 0 60px #30372d12;overflow-y:auto}.studio.open{transform:translateX(0)}.studio-head{display:flex;justify-content:space-between;align-items:flex-start;padding:32px 27px 24px;border-bottom:1px solid var(--line)}.micro{font-size:8px;letter-spacing:1.8px;color:var(--muted)}.studio h2{font:500 26px 'Playfair Display',Georgia,serif;margin:13px 0 0;letter-spacing:-.7px}.studio h2 span{font:20px Georgia;color:var(--rose);margin-left:12px}.studio-head>button{font-size:28px;line-height:1;padding:0 2px}.studio-content{padding:0 27px 25px}.studio-description{font-size:11px;color:var(--muted);margin:23px 0 31px}.setting{margin-bottom:24px}.setting label,.setting-title{display:flex;justify-content:space-between;font-size:11px;margin-bottom:11px}.setting output{font-size:10px;color:var(--muted);font-variant-numeric:tabular-nums}.paper-setting{display:flex;align-items:center;justify-content:space-between;margin:26px 0 30px}.paper-setting .setting-title{margin:0}.paper-choices{display:flex;gap:10px}.paper-choices button{width:23px;height:23px;background:var(--paper-choice);border:1px solid #c5c6bb;border-radius:50%;outline-offset:3px}.paper-choices button[aria-pressed=true]{outline:1px solid var(--olive)}.layer-heading{display:flex;align-items:center;justify-content:space-between;padding-top:23px;border-top:1px solid var(--line);font-size:8px;letter-spacing:1.3px}.layer-heading button{font-size:10px;letter-spacing:0;text-decoration:underline;text-underline-offset:3px;color:var(--muted);padding:5px 0}.layers{margin-top:10px}.layer{display:flex;align-items:center;gap:12px;padding:10px 0;font-size:11px}.layer i{width:13px;height:13px;background:var(--swatch);border-radius:50%;border:1px solid #30372d18}.layer input{accent-color:var(--olive);margin-left:auto;width:14px;height:14px}.studio-actions{display:flex;justify-content:space-between;border-top:1px solid var(--line);margin-top:20px;padding-top:24px}.studio-actions button{font-size:11px;padding:10px 0}.studio-actions button:last-child{background:var(--ink);color:var(--panel);padding:10px 20px;border-radius:2px}.studio-footnote{font-size:9px;line-height:1.7;color:var(--muted);margin:22px 0 0}.scrim{position:fixed;inset:0;z-index:10;background:#30372d22;backdrop-filter:blur(3px);opacity:0;visibility:hidden;transition:opacity .4s,visibility .4s}.scrim.open{opacity:1;visibility:visible}@media(min-width:1600px){.intro-copy{left:5%}.stage{min-height:660px}.intro-copy h1{font-size:91px}.intro-copy p{font-size:14px}}@media(max-width:1000px){.mast-note{font-size:7px;letter-spacing:1.5px}.intro-copy{left:1%;top:20%}h1{font-size:59px}.chapter{font-size:6px;letter-spacing:.8px}.note-top{font-size:6px;right:0}.note-top b{font-size:9px}.note-bottom{right:1%}.handwritten{font-size:18px}.color-study{left:1%}.transport{gap:20px}.transport-caption{min-width:170px}}@media(max-width:700px){.masthead{height:82px;padding:0 6%}.masthead:after{left:6%;right:6%}.wordmark{font-size:35px}.wordmark-star{font-size:20px}.mast-note{display:none}.studio-toggle{font-size:10px;gap:8px}.studio-toggle>span:last-child{margin-left:0}main{padding:0 6%}.folio{height:48px;font-size:7px;letter-spacing:1px}.folio-right{gap:8px}.folio-line{width:15px}.stage{height:calc(100svh - 280px);min-height:620px;max-height:850px}.intro-copy{top:3%;left:0}.chapter{font-size:6px}.chapter>span:first-child{font-size:9px}h1{font-size:46px;line-height:1.03;margin:17px 0 12px;letter-spacing:-1.9px}h1 br:first-child{display:none}h1 em{margin-top:0}.intro-copy p{font-size:10px;line-height:1.7}.text-replay{margin-top:12px;font-size:9px;gap:7px}.text-replay span{font-size:16px}.giant-z{font-size:600px;top:20%;left:-5%}.sketch-orbit{top:25%;left:0;width:100%;height:72%}.reg-one{top:39%;left:6%}.reg-two{left:95%;bottom:5%}.note-top{top:29%;font-size:6px;right:0}.note-line{width:20px}.note-bottom{bottom:5%;right:0;gap:0}.handwritten{font-size:15px}.note-bottom svg{width:50px;height:27px}.vertical-note{display:none}.color-study{left:0;bottom:2%}.color-study>span{font-size:6px;letter-spacing:.7px}.swatches{gap:5px;margin-top:9px}.swatches i{height:11px;width:11px}.transport{height:92px;flex-wrap:wrap;column-gap:10px;row-gap:0;padding:12px 0}.transport-caption{min-width:0;flex:1;font-size:9px}.playback{gap:6px}.playback button{width:28px;height:28px}.timeline-wrap{flex-basis:100%;order:3;max-width:none;gap:10px;font-size:8px}footer{height:56px;font-size:6px;letter-spacing:.65px}footer>span{gap:5px}.footer-star{font-size:11px}footer>span:last-child{max-width:145px;text-align:right;line-height:1.7}.studio{width:340px}#loading{left:50%;top:65%}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}
@media(max-width:700px){.note-top{display:none}footer>span:last-child{display:block}}
.interaction-hint{position:absolute;bottom:1.2%;left:65%;transform:translateX(-50%);z-index:3;pointer-events:none;white-space:nowrap;font-size:8px;letter-spacing:.4px;color:var(--muted);display:flex;align-items:center;gap:8px}.interaction-hint span{font-size:19px;color:var(--rose)}canvas{cursor:crosshair}.paper-grain{opacity:.027}.sketch-orbit{stroke:#7b8b69;opacity:.29}.swatches i{box-shadow:inset 0 0 0 1px #30372d09}.studio-description{margin-bottom:25px}.setting{margin-bottom:20px}@media(max-width:700px){.interaction-hint{left:50%;bottom:0;font-size:7px}.color-study{bottom:4%}.note-bottom{bottom:7%}}@media(prefers-reduced-motion:reduce){.interaction-hint{display:none}canvas{cursor:default}}
/* V2: a persistent inspector, with no overlay or obscured artwork. */
:root{--studio-width:332px}body{padding-right:var(--studio-width)}.masthead{height:86px}.mast-note{font-size:7px;letter-spacing:1.6px}.wordmark{font-size:37px}.studio{transform:none;box-shadow:none;width:var(--studio-width);border-left:1px solid var(--line);background:#f5f3eb;scrollbar-width:thin;scrollbar-color:#c0c6b3 transparent}.studio-head{position:sticky;top:0;z-index:2;background:#f5f3eb;padding:26px 22px 23px;align-items:center}.studio h2{font-size:24px}.studio h2 span{font-size:18px;margin-left:7px}.studio-live{font-size:8px;display:flex;gap:5px;align-items:center;color:var(--muted)}.studio-live .live-dot{width:4px;height:4px}.studio-content{padding:0 22px 18px}.studio-section{padding:24px 0 4px;border-bottom:1px solid var(--line)}.section-label{display:flex;align-items:center;justify-content:space-between;font-size:8px;letter-spacing:1px;margin-bottom:16px}.section-label>span:last-child{font-size:8px;letter-spacing:0;color:var(--muted)}.palette-options{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:24px}.palette-option{border:1px solid transparent;border-radius:3px;padding:7px 3px 6px;font-size:8px;color:var(--muted)}.palette-option[aria-pressed=true]{border-color:#a0aa90;background:#e7ebdf;color:var(--ink)}.palette-colors{display:flex;justify-content:center;margin-bottom:8px}.palette-colors i{height:17px;width:12px;display:block;background:var(--swatch)}.palette-colors i:first-child{border-radius:7px 0 0 7px}.palette-colors i:last-child{border-radius:0 7px 7px 0}.complexion-title{font-size:10px;align-items:center;margin-bottom:12px}.complexion-title span{font-size:8px;color:var(--muted)}.skin-options{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:22px}.skin-option{display:flex;align-items:center;flex-direction:column;gap:6px;font-size:8px;color:var(--muted);padding:7px 0;border-radius:3px;border:1px solid transparent}.skin-option[aria-pressed=true]{border-color:#a0aa90;background:#e7ebdf;color:var(--ink)}.skin-option .palette-colors{margin:0}.skin-option .palette-colors i{height:23px;width:12px}.expression-options{display:flex;border:1px solid var(--line);border-radius:4px;padding:3px;gap:3px}.expression-options button{flex:1;font-size:10px;padding:9px 0;border-radius:2px;color:var(--muted)}.expression-options button[aria-pressed=true]{background:var(--ink);color:var(--panel)}.character-description{font-size:9px;line-height:1.6;color:var(--muted);margin:12px 0 15px}.gesture-buttons{display:flex;gap:8px;margin-bottom:21px}.gesture-buttons button{flex:1;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--line);padding:11px;font-size:10px;border-radius:3px;transition:background .2s,transform .2s}.gesture-buttons button:hover{background:#e6eadc;transform:translateY(-1px)}.gesture-buttons button span{font-size:16px;color:var(--rose)}.studio-group{border-bottom:1px solid var(--line)}.studio-group summary{display:flex;justify-content:space-between;list-style:none;cursor:pointer;font-size:8px;letter-spacing:1px;padding:22px 0}.studio-group summary::-webkit-details-marker{display:none}.studio-group summary>span:last-child{font-size:15px;line-height:.7;color:var(--muted)}.studio-group[open] summary>span:last-child{transform:rotate(45deg)}.group-content{padding:0 0 3px}.setting label{font-size:10px}.setting{margin-bottom:19px}.setting output{font-size:9px}.studio-actions{border-top:0;margin-top:0;padding-top:20px;position:relative}.studio-actions button{font-size:10px}.studio-footnote{font-size:8px;margin-top:15px}.layer-heading{padding-top:0;border-top:0}.layer{font-size:10px}.scrim{display:none!important}.stage{height:calc(100svh - 285px)}.intro-copy{top:18%;left:1.5%}.intro-copy h1{font-size:clamp(48px,4.8vw,72px)}.chapter{font-size:6px;gap:8px;letter-spacing:1px}.intro-copy p{font-size:11px}.color-study{left:1.5%}.note-top{right:1%;font-size:6px}.note-top b{font-size:10px}.note-bottom{right:1%}.handwritten{font-size:18px}.vertical-note{font-size:6px}.transport{gap:18px}.transport-caption{min-width:165px;font-size:9px}.playback{gap:8px}.folio{height:54px}.giant-z{font-size:clamp(500px,49vw,820px)}.masthead .studio-toggle{font-size:9px}.studio-content button:focus-visible{outline-offset:2px}@media(max-width:1300px) and (min-width:1001px){:root{--studio-width:310px}.studio-content{padding-left:18px;padding-right:18px}.studio-head{padding-left:18px;padding-right:18px}.mast-note{display:none}.intro-copy h1{font-size:52px}.intro-copy p{font-size:10px}.chapter{font-size:5px;letter-spacing:.6px}.chapter i{width:15px}.note-top{display:none}.note-bottom{right:1%;bottom:9%}.handwritten{font-size:15px}.transport-caption{min-width:140px;font-size:8px}.timeline-wrap{gap:8px}.playback{gap:3px}.playback button{width:26px}.transport{gap:10px}.vertical-note{display:none}.interaction-hint{font-size:6px;left:64%}.swatches i{height:12px;width:12px}}
@media(max-width:1000px){body{padding-right:0}.studio{position:relative;inset:auto;transform:none;width:auto;max-width:none;height:auto;border-left:0;border-top:1px solid var(--line);overflow:visible}.studio-head{position:static;padding:25px 6%;background:#f5f3eb}.studio-content{padding:0 6% 24px;display:grid;grid-template-columns:1fr 1fr;gap:0 35px}.studio-section{padding-top:22px}.studio-actions,.studio-footnote{grid-column:1/-1}.studio-actions{justify-content:flex-end;gap:25px}.studio-footnote{text-align:right}.stage{height:calc(100svh - 285px)}.mast-note{display:block}.intro-copy h1{font-size:59px}.intro-copy{left:1%;top:20%}.chapter{font-size:6px}.palette-colors i{width:14px}}
@media(max-width:700px){.masthead{height:82px}.mast-note{display:none}.intro-copy{top:3%;left:0}.intro-copy h1{font-size:46px}.intro-copy p{font-size:10px}.stage{height:calc(100svh - 280px)}.folio{height:48px}.color-study{left:0}.transport-caption{min-width:0;flex:1}.playback{gap:6px}.handwritten{font-size:15px}.interaction-hint{font-size:7px;left:50%}.studio-content{display:block}.studio-section{padding-top:24px}.studio-footnote{text-align:left}.studio-actions{justify-content:space-between}.palette-colors i{width:18px}.skin-option .palette-colors i{width:15px}.studio-group summary{padding:22px 0}.studio-content{padding-bottom:30px}}