:root{font-family:Inter,Helvetica Neue,Arial,Microsoft YaHei,sans-serif;color:#302f24;background:#fff3df;font-synthesis:none;color-scheme:light}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,summary{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #575d37;outline-offset:5px}#artwork{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}header{position:fixed;inset:36px 40px auto;display:flex;align-items:center;justify-content:space-between;pointer-events:none}.identity{display:flex;gap:13px;align-items:center}.mark{font-size:49px;line-height:1;font-weight:300}h1{font-size:38px;letter-spacing:-2px;font-weight:650;line-height:1;margin:0}.dot{color:#637139}.identity p{font-size:10px;letter-spacing:1.8px;margin:10px 0 0;opacity:.6}nav{display:flex;gap:8px;pointer-events:auto}nav button{height:42px;padding:0 16px;display:flex;align-items:center;gap:9px;border:1px solid #403c251c;border-radius:24px;background:#fffbef99;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);font-size:12px;transition:background .2s}nav button:hover{background:#fffbefe6}#pause-icon{font-size:17px;width:14px}.panel{position:fixed;right:40px;bottom:36px;width:280px;max-height:calc(100dvh - 160px);overflow:auto;overscroll-behavior:contain;border:1px solid #ffffffa8;border-radius:20px;background:#fffaf0c9;box-shadow:0 8px 48px #54491f0b;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:23px 24px 19px}summary::-webkit-details-marker{display:none}.eyebrow{display:block;font-size:8px;letter-spacing:2.1px;opacity:.48;margin-bottom:7px}summary strong{font-size:17px;font-weight:500;letter-spacing:1px}.collapse{font-size:22px;font-weight:300;opacity:.5}details:not([open]) .collapse{font-size:0}details:not([open]) .collapse:after{content:"+";font-size:22px}.panel-body{padding:0 24px}.range-control{margin:0 0 19px}.range-control label{display:flex;justify-content:space-between;font-size:12px;margin:0 0 10px}output{font-size:10px;font-variant-numeric:tabular-nums;opacity:.55}.control-hint{font-size:9px;line-height:1.6;color:#777769;margin:-8px 0 18px}input[type=range]{display:block;width:100%;height:16px;margin:0;appearance:none;background:transparent;cursor:pointer;touch-action:pan-y}input[type=range]::-webkit-slider-runnable-track{height:2px;background:#3f402b24;border-radius:3px}input[type=range]::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#575e39;border:3px solid #fff9ed;box-shadow:0 0 0 1px #575e3966;margin-top:-5px}input[type=range]::-moz-range-track{height:2px;background:#3f402b24}input[type=range]::-moz-range-thumb{width:7px;height:7px;border:3px solid #fff9ed;border-radius:50%;background:#575e39}.palette-label{display:flex;justify-content:space-between;font-size:12px;margin-top:23px}.palette-label span{font-size:9px;opacity:.42}.palette{display:flex;justify-content:space-between;margin:14px 0 20px}.palette label{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:8px;color:#777769;cursor:pointer}input[type=color]{appearance:none;padding:0;border:1px solid #51472a1c;width:29px;height:29px;overflow:hidden;border-radius:50%;background:transparent;cursor:pointer}input[type=color]::-webkit-color-swatch-wrapper{padding:0}input[type=color]::-webkit-color-swatch{border:0;border-radius:50%}input[type=color]::-moz-color-swatch{border:0;border-radius:50%}.panel-footer{border-top:1px solid #38331d14;display:flex;justify-content:space-between;align-items:center;min-height:49px;font-size:9px;color:#7a7c66}.panel-footer>span{display:flex;align-items:center;gap:6px}.panel-footer i{width:5px;height:5px;background:#91a44a;border-radius:50%}.panel-footer i.paused{background:#aaa692}.panel-footer button{border:0;background:none;font-size:10px;padding:10px 0 10px 12px}.panel-footer button span{margin-left:6px}footer{position:fixed;left:40px;bottom:38px;pointer-events:none}.edition{font-size:9px;letter-spacing:2px;opacity:.48}footer p{font-size:11px;letter-spacing:1px;margin:10px 0 0;opacity:.65}footer p span{margin-left:10px}#message{position:fixed;left:50%;top:110px;transform:translate(-50%);width:min(90%,460px);padding:16px 20px;border-radius:12px;background:#fffaf0ee;font-size:13px;line-height:1.7;box-shadow:0 2px 30px #0001}@media(max-width:600px){header{inset:24px 20px auto}.mark{font-size:36px}.identity{gap:8px}h1{font-size:29px}.identity p{font-size:8px;letter-spacing:1px;margin-top:7px}nav{gap:6px}nav button{padding:0 11px;height:38px;font-size:10px;gap:6px}.panel{right:20px;bottom:22px;width:244px;border-radius:17px}summary{padding:17px 20px 15px}.panel-body{padding:0 20px}.range-control{margin-bottom:13px}.palette-label{margin-top:17px}.palette{margin-bottom:13px}footer{left:20px;top:124px;bottom:auto}.edition{font-size:7px;letter-spacing:1.4px}footer p{font-size:9px}.panel-footer{min-height:42px}}@media(max-height:560px){header{inset:18px 22px auto}.panel{bottom:14px;right:22px;width:250px;max-height:calc(100dvh - 90px);overflow:auto}summary{padding:13px 20px}.panel-body{padding:0 20px}.range-control{margin-bottom:8px}.palette-label{margin-top:12px}.palette{margin:10px 0}.panel-footer{min-height:34px}footer{left:22px;bottom:22px}}.panel{width:310px;max-height:calc(100dvh - 130px);overflow:hidden}.panel-body{padding:18px 24px 0;max-height:calc(100dvh - 310px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#888b6b55 transparent}.panel-footer{padding:0 24px}.tabs{display:flex;margin:0 20px;border-bottom:1px solid #38331d18;gap:4px}.tabs button{flex:1;border:0;border-bottom:2px solid transparent;padding:10px 4px;background:none;font-size:11px;color:#8a8b78}.tabs button[aria-selected=true]{color:#4e5734;border-bottom-color:#687747}.select-control,.text-control,.upload-control{display:block;font-size:12px;margin:0 0 20px}select,textarea{font:inherit;color:inherit;width:100%;margin-top:10px;border:1px solid #555d392b;border-radius:8px;background:#ffffff50;padding:10px;outline-offset:3px}select{cursor:pointer}textarea{resize:vertical;min-height:60px;max-height:180px;line-height:1.5}.inline-color{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin-bottom:18px}.follow-control{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin:0 0 18px;cursor:pointer}.follow-control input{accent-color:#687747;width:18px;height:18px;cursor:pointer}.upload-control{padding:14px;border:1px dashed #555d3955;border-radius:10px;margin-bottom:12px}input[type=file]{display:block;margin-top:12px;font:inherit;font-size:10px;width:100%;color:#727761}input[type=file]::file-selector-button{font:inherit;border:0;border-radius:5px;background:#e2e8ce;padding:8px;color:#4c5630;margin-right:5px;cursor:pointer}.file-status{overflow-wrap:anywhere;margin:0 0 10px}.small-button{border:1px solid #555d3933;background:#fff5;border-radius:8px;padding:9px 12px;font-size:11px;margin:0 0 20px}.small-button:hover{background:#fffdf4}.section-divider{border-top:1px solid #38331d18;margin:24px 0}input:disabled{opacity:.4;cursor:not-allowed}.panel section>.control-hint:last-child{margin:0 0 18px;line-height:1.8}@media(max-width:600px){.panel{width:270px}.panel-body{padding:16px 20px 0}.panel-footer{padding:0 20px}.tabs{margin:0 16px}.tabs button{padding:8px 2px}}@media(max-height:560px){.panel{max-height:calc(100dvh - 90px)}.panel-body{max-height:calc(100dvh - 230px)}}