:root{color-scheme:light;--ink:#424c39;--paper:#f4edda;--line:#6c735542;--muted:#787c65;font-family:Georgia,'Times New Roman',serif;background:var(--paper);color:var(--ink)}
*{box-sizing:border-box}body{margin:0;height:100dvh;min-height:360px;display:flex;flex-direction:column;overflow:hidden;background:var(--paper);transition:background 2s,color 2s}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:#f7f2e37a;border-radius:30px;min-height:40px;padding:7px 16px;transition:background .2s,transform .2s}button:hover{background:#fff8e7;transform:translateY(-1px)}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #9d7748;outline-offset:4px}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}.masthead{height:102px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:relative;z-index:2;border-bottom:1px solid var(--line)}.home{font-size:13px;letter-spacing:.05em}.home:first-letter{font-size:21px}.title{text-align:center;position:absolute;left:50%;transform:translateX(-50%)}.eyebrow{font:9px/1.5 system-ui,sans-serif;letter-spacing:.2em;color:var(--muted)}h1{font-weight:normal;letter-spacing:-1.4px;font-size:38px;margin:2px 0 0;white-space:nowrap}h1 span{color:#a6784b}#sound{font:12px system-ui,sans-serif;display:flex;align-items:center;gap:9px}#sound>span:first-child{font-size:22px}main{flex:1;min-height:0;position:relative;overflow:hidden;background:#d8d6b9}canvas{width:100%;height:100%;display:block;touch-action:none;cursor:grab;outline-offset:-4px!important}.scene-caption{position:absolute;top:25px;left:29px;display:flex;align-items:center;gap:10px;font-style:italic;font-size:13px;color:#555c44;background:#f6edcfba;padding:8px 12px;border-radius:20px;pointer-events:none}.tiny-rule{width:19px;height:1px;background:currentColor}.toolbar{min-height:77px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 28px;border-top:1px solid var(--line)}.invitation{display:flex;align-items:center;gap:13px;flex:1}.invitation p{font-size:14px;font-style:italic;margin:0}.droplet{font-size:28px;color:#7a907c}.time-controls{display:flex;align-items:center;gap:13px;font:11px system-ui,sans-serif}.time-controls input{width:135px}.time-controls output{width:56px;font-variant-numeric:tabular-nums}input[type=range]{accent-color:#77866a;height:22px;cursor:pointer}#time-icon{font-size:23px}.time-controls button,#about-toggle,.zoom-controls button{width:36px;height:36px;min-height:36px;padding:0}#about-toggle{font-style:italic;font-size:17px}.zoom-controls{position:absolute;right:20px;bottom:18px;display:flex;gap:4px}.zoom-controls button{background:#f4edded9;color:#424c39}.zoom-controls #fit{font-size:20px}#field-notes{position:fixed;z-index:10;right:22px;bottom:93px;width:min(390px,calc(100% - 32px));max-height:calc(100dvh - 130px);overflow:auto;background:#f8f1df;color:#424c39;border:1px solid #a2977455;padding:30px;box-shadow:0 14px 60px #252b2630;border-radius:5px 28px 5px 5px}#field-notes h2{font-size:31px;line-height:1.13;font-weight:normal;margin:16px 0}#field-notes p{font-size:14px;line-height:1.6}.close{position:absolute;right:12px;top:12px;border:0;font-size:25px;padding:0;width:30px;min-height:30px}.keys{color:#73765f}kbd{font:11px system-ui;border-bottom:1px solid #b8bca5}.volume{font-size:13px;display:flex;align-items:center;justify-content:space-between;margin-top:22px}.volume input{width:140px}.motion{display:flex;align-items:center;gap:8px;font-size:13px;margin:10px 0}.credits{font-size:10px!important;color:#797d67}.credits a{text-decoration:underline}#egg{position:absolute;z-index:4;max-width:320px;padding:17px 22px;background:#f6f0dfee;color:#454b3b;border:1px solid #e0d7b9;border-radius:2px 22px 3px 18px;box-shadow:0 5px 30px #15273522;pointer-events:none;font-size:15px;line-height:1.5}#egg::before{content:'';position:absolute;left:50%;top:-35px;height:35px;width:1px;background:#ebe8d5}.silk{display:block;font-size:11px;font-style:italic;color:#7b7e69;margin-bottom:5px}#egg strong{font-weight:normal}body.night{--paper:#222f36;--ink:#e2e0c9;--muted:#aab9af;--line:#c4d4ba26}body.night button:not(.zoom-controls button):not(#field-notes button){background:#314047}body.night .scene-caption{background:#1c303bbd;color:#d1daca}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}[hidden]{display:none!important}
@media(max-width:700px){.masthead{height:91px;padding:0 15px;align-items:flex-start;padding-top:13px}.home span{display:none}.home{padding:9px}.title{top:17px}h1{font-size:29px}.eyebrow{font-size:7px;letter-spacing:.15em}#sound{padding:4px 10px;gap:4px;min-height:34px}#sound-label{font-size:0}#sound-label::first-letter{font-size:0}.toolbar{padding:9px 14px;gap:9px;flex-wrap:wrap;min-height:97px}.invitation{flex-basis:calc(100% - 50px);order:0}.invitation p{font-size:12px}.droplet{font-size:22px}#about-toggle{order:1}.time-controls{order:2;width:100%;justify-content:center;gap:12px}.time-controls input{width:min(45vw,240px)}.scene-caption{left:12px;top:12px;font-size:11px;padding:6px 10px}.zoom-controls{right:12px;bottom:12px}#field-notes{bottom:110px}.time-controls button{min-height:28px;height:28px}#egg{font-size:12px;max-width:260px}}
body{color:var(--ink)}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}