@font-face{font-family:'Instrument Serif';src:url('./assets/fonts/instrument-serif-latin-400-normal.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}@font-face{font-family:'Instrument Serif';src:url('./assets/fonts/instrument-serif-latin-400-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}@font-face{font-family:'DM Sans';src:url('./assets/fonts/dm-sans-latin-400-normal.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
:root{--paper:#eeeae1;--ink:#252a26;--muted:#76796f;--line:#cdcec2;--accent:#527665;color-scheme:light;font-family:'DM Sans','PingFang SC',sans-serif;background:var(--paper);color:var(--ink)}
*{box-sizing:border-box}body{margin:0;color:var(--ink);transition:background .6s,color .6s;background:var(--paper)}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid var(--accent);outline-offset:5px}header{height:108px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:3}.identity{display:flex;align-items:center;gap:18px;font-size:11px;letter-spacing:2.1px;font-weight:600}.monogram{font-family:'Instrument Serif',Georgia,serif;font-size:43px;letter-spacing:-4px;margin-right:6px}.edition{font-size:10px;letter-spacing:2px;color:var(--muted);display:flex;align-items:center;gap:9px}.edition i{width:6px;height:6px;background:var(--accent);border-radius:50%}.home-link{font-size:11px}.home-link span{font-size:18px;margin-left:18px}main{min-height:650px;height:calc(100svh - 166px);max-height:1060px;position:relative;padding:0 5%;display:grid;grid-template-columns:35% 1fr 52px;grid-template-rows:1fr 112px;overflow:hidden}.intro{align-self:center;position:relative;z-index:2;pointer-events:none;padding-bottom:24px}.eyebrow{font-size:9px;letter-spacing:2.8px;color:var(--muted);margin:0 0 30px}h1{font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(76px,8.3vw,142px);line-height:.95;letter-spacing:-4px;margin:0}h1 em{color:var(--accent);font-weight:400}.intro-bottom{display:flex;gap:18px;align-items:flex-start;margin-top:34px}.small-rule{width:34px;height:1px;background:var(--accent);margin-top:11px}.intro-bottom p{font-size:12px;line-height:1.9;color:var(--muted);margin:0;letter-spacing:1px}.stage{position:absolute;inset:0 5% 112px 28%;overflow:hidden}#scene,.poster{width:100%;height:100%;position:absolute;inset:0;display:block;object-fit:contain}.poster{transition:opacity .4s;z-index:1;pointer-events:none}#scene{touch-action:none;opacity:0;transition:opacity .5s;z-index:2}.stage.ready #scene{opacity:1}.stage.ready .poster{opacity:0}.stage-line{position:absolute;border:1px solid var(--line);border-radius:50%;width:min(40vw,560px);height:min(40vw,560px);left:50%;top:50%;transform:translate(-50%,-50%);opacity:.45;pointer-events:none}.stage-line-two{width:min(47vw,660px);height:min(47vw,660px);opacity:.2}.axis-mark{position:absolute;color:var(--muted);font-size:8px;letter-spacing:1.5px;left:50%;transform:translateX(-50%);z-index:1}.axis-top{top:26px}.axis-bottom{bottom:32px}.hint{position:absolute;bottom:15px;left:50%;transform:translateX(-50%);z-index:3;font-size:10px;color:var(--muted);letter-spacing:1px;white-space:nowrap}.reset-view{position:absolute;right:30px;bottom:26px;width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:20px;z-index:3}.load-status{position:absolute;top:52%;left:50%;transform:translate(-50%,-50%);font-size:12px;color:var(--muted);z-index:4;white-space:nowrap}.stage.ready .load-status{display:none}.specimen{grid-column:3;grid-row:1;align-self:center;justify-self:end;position:relative;z-index:3;display:flex;align-items:center;flex-direction:column;gap:28px}.specimen-number{writing-mode:vertical-rl;font-size:9px;letter-spacing:2px;color:var(--muted)}.specimen-line{width:1px;height:80px;background:var(--line)}.specimen p{font-size:8px;line-height:1.9;letter-spacing:1.5px;margin:0;color:var(--muted)}.control-bar{grid-column:1/-1;grid-row:2;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;position:relative;z-index:3;gap:20px}.piece-caption{display:flex;align-items:center;gap:22px}.caption-index{font-family:'Instrument Serif',Georgia,serif;font-size:38px;color:var(--muted)}h2{font-weight:500;font-size:14px;letter-spacing:2px;margin:0 0 7px}.piece-caption p{font-size:8px;letter-spacing:1.5px;margin:0;color:var(--muted)}.light-options{display:flex;gap:12px;align-items:center}.control-label{font-size:8px;letter-spacing:2px;color:var(--muted);margin-right:8px}.swatch{border:1px solid transparent;background:transparent;border-radius:24px;padding:10px;display:flex;align-items:center;gap:7px;font-size:10px}.swatch.is-active{border-color:var(--line)}.swatch i{width:11px;height:11px;border-radius:50%;border:1px solid #0002}.day-dot{background:#ded9c7}.dusk-dot{background:#c99170}.night-dot{background:#253b3d}.motion-options{display:flex;gap:8px}.motion-options button{border:1px solid var(--line);border-radius:24px;background:transparent;padding:12px 18px;font-size:11px;display:flex;gap:12px;align-items:center;min-height:42px}#unfold{background:var(--ink);color:var(--paper);border-color:var(--ink)}button:hover{filter:brightness(.9)}footer{height:58px;margin:0 5%;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:8px;letter-spacing:1.5px}footer i{font-style:normal;font-size:19px;color:var(--accent);margin-left:20px}.noscript{position:fixed;bottom:20px;text-align:center;width:100%;font-size:12px}body[data-light=dusk]{--paper:#ead9c8;--ink:#49372d;--muted:#8a6f5c;--line:#cdb7a1;--accent:#a15937}body[data-light=night]{--paper:#192b2e;--ink:#dedbc8;--muted:#90a4a0;--line:#415356;--accent:#b1caba;color-scheme:dark}body[data-light=night] .poster{filter:brightness(.7)}
@media(min-width:1600px){main{padding-left:max(5%,calc((100vw - 1500px)/2));padding-right:max(5%,calc((100vw - 1500px)/2))}}
@media(max-width:900px){header{height:80px}.edition{display:none}main{height:auto;min-height:calc(100svh - 132px);grid-template-columns:1fr;grid-template-rows:auto 410px auto;padding-top:32px}.intro{align-self:start;padding:0;z-index:3}.eyebrow{margin-bottom:16px;font-size:8px}h1{font-size:76px;letter-spacing:-2px}h1 br{display:none}h1 em{margin-left:8px}.intro-bottom{margin-top:18px}.intro-bottom p{font-size:11px}.stage{position:relative;inset:auto;grid-column:1;grid-row:2;margin:-24px -5vw -5px;height:440px}.stage-line-one{width:320px;height:320px}.stage-line-two{width:380px;height:380px}.axis-top{display:none}.specimen{display:none}.control-bar{grid-row:3;flex-wrap:wrap;padding:24px 0;gap:22px}.piece-caption{flex:1;min-width:170px}.light-options{order:3;width:100%;justify-content:center;border-top:1px solid var(--line);padding-top:16px}.light-options button{padding:12px 16px}.motion-options button{padding:12px 16px}.control-label{font-size:9px}footer{height:52px;font-size:7px;letter-spacing:.9px}footer span:last-child{font-size:8px}footer i{margin-left:5px}.hint{bottom:18px}.axis-bottom{bottom:39px}}
@media(max-width:420px){header{padding:0 6%}.identity{font-size:9px;gap:12px}.home-link{font-size:10px}.home-link span{margin-left:6px}main{padding-left:6%;padding-right:6%}h1{font-size:65px}.control-bar{gap:18px}.piece-caption{min-width:100%;gap:16px}.motion-options{width:100%;justify-content:center}.light-options{order:0;width:auto;border:0;padding:0;gap:4px}.control-label{display:none}.motion-options{order:3}.stage{height:410px;margin-top:-20px}.control-bar{justify-content:center}.piece-caption{justify-content:center}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}