:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--paper:#b9b546;background:#b9b546}*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden}body{min-width:320px}.app{isolation:isolate;background:var(--paper);position:relative}.canvas-wrap,.canvas-wrap canvas{width:100%;height:100%;position:absolute;inset:0}.canvas-wrap canvas{cursor:crosshair;touch-action:none;display:block}:root[data-showcase] .canvas-wrap canvas{cursor:default}:root[data-cursor-idle="1"],:root[data-cursor-idle="1"] *{cursor:none!important}.fallback{background:var(--paper);place-items:center;display:grid;position:absolute;inset:0}.fallback[hidden]{display:none}.fallback img{object-fit:contain;width:100%;height:100%;display:block}.settings-panel[hidden],.shadow-control[hidden],.reveal-control[hidden],.shadow-control button[hidden]{display:none}.preview-controls{z-index:3;top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));--settings-label:46px;flex-direction:column;align-items:flex-end;gap:8px;max-width:calc(100% - 32px);display:flex;position:absolute}.preview-controls[hidden],:root[data-ui="0"] .preview-controls{display:none}.settings-toggle{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#1716128c;cursor:pointer;background:#f4f1e8b8;border:1px solid #1716121f;border-radius:999px;place-items:center;width:44px;height:44px;padding:0;display:grid;box-shadow:0 8px 24px #322c1f0f}.settings-toggle__icon{width:18px;height:18px}.settings-toggle:hover{color:#171612}.settings-toggle[aria-expanded=true]{color:#f4f1e8;background:#171612;border-color:#171612}.settings-toggle:focus-visible{outline-offset:2px;outline:2px solid #171612a6}.settings-panel{flex-direction:column;align-items:stretch;gap:2px;max-width:100%;display:flex}.settings-panel.is-sized{overscroll-behavior:contain;max-height:calc(100dvh - 84px);overflow-y:auto}.settings-resize{z-index:1;cursor:ew-resize;touch-action:none;width:14px;position:absolute;top:52px;bottom:0;left:-8px}.settings-panel[hidden]+.settings-resize{display:none}.settings-resize:after{content:"";opacity:0;background:#17161273;border-radius:999px;width:4px;height:min(64px,60%);transition:opacity .12s;position:absolute;top:50%;left:5px;transform:translateY(-50%)}.settings-resize:hover:after,.settings-resize:focus-visible:after,.settings-resize.is-dragging:after{opacity:1}.settings-resize:focus-visible{outline:none}.is-resizing-settings,.is-resizing-settings *{-webkit-user-select:none;user-select:none;cursor:ew-resize!important}@media (prefers-reduced-motion:no-preference){.settings-toggle__icon{transition:transform .22s}.settings-toggle[aria-expanded=true] .settings-toggle__icon{transform:rotate(67.5deg)}.settings-panel{animation:.16s ease-out settings-panel-in}}@keyframes settings-panel-in{0%{opacity:0;transform:translateY(-6px)}}.reveal-control,.shadow-control{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#171612;background:#f4f1e8b8;border:1px solid #1716121f;border-radius:999px;flex-wrap:wrap;align-items:center;gap:8px;padding:4px;font-family:system-ui,sans-serif;display:flex;box-shadow:0 8px 24px #322c1f0f}.shadow-control{padding:4px 4px 4px 12px}.reveal-control{grid-template-columns:var(--settings-label) minmax(108px, 150px) minmax(44px, 1fr);border-radius:12px;padding:8px 12px;display:grid}.reveal-control>span,.reveal-control output{color:#17161294;white-space:nowrap;font-size:10px}.reveal-control output{text-align:right;font-variant-numeric:tabular-nums}.reveal-control input{accent-color:#171612;cursor:pointer;width:100%}.reveal-control.settings-check:not([hidden]){cursor:pointer;-webkit-user-select:none;user-select:none;gap:8px;padding:7px 12px;display:flex}.reveal-control.settings-check input[type=checkbox]{flex:none;width:14px;height:14px;margin:0}.reveal-control.rim-control{grid-template-columns:var(--settings-label) 26px minmax(108px, 150px) minmax(44px, 1fr)}.reveal-control.rim-control input[type=color]{cursor:pointer;background:0 0;border:1px solid #17161238;border-radius:999px;width:26px;height:26px;padding:0}.reveal-control.rim-control.is-off input[type=color]{opacity:.55}.reveal-control input:disabled{cursor:default;opacity:.38}.reveal-control.has-step{grid-template-columns:var(--settings-label) minmax(108px, 150px) auto minmax(44px, 1fr)}.slider-step{gap:2px;display:inline-flex}.slider-step button{color:#1716129e;cursor:pointer;background:0 0;border:1px solid #1716122e;border-radius:999px;place-items:center;width:24px;height:20px;padding:0;font:13px/1 system-ui,sans-serif;display:grid}.slider-step button:hover:not(:disabled){color:#171612;border-color:#171612}.slider-step button:focus-visible{outline-offset:1px;outline:2px solid #171612a6}.slider-step button:disabled{cursor:default;opacity:.38}.shadow-color-control input[type=color]{background:0 0;border:1px solid #17161238;border-radius:6px;height:30px;padding:2px}.shadow-color-control output{font-family:ui-monospace,monospace}.shadow-control>span{flex:0 0 var(--settings-label);color:#17161280;letter-spacing:.08em;white-space:nowrap;padding:0;font-size:10px}.shadow-control button{color:#1716128c;cursor:pointer;min-width:42px;font:inherit;background:0 0;border:0;border-radius:999px;padding:7px 10px;font-size:11px}.shadow-control button.is-active{color:#f4f1e8;background:#171612}.preset-control{border-radius:18px}.preset-list{display:contents}.preset-item{border:1px solid #17161229;border-radius:999px;align-items:center;display:inline-flex}.preset-item button.preset-apply{color:#171612c7;min-width:0;padding:6px 4px 6px 10px}.preset-item button.preset-delete{color:#17161266;min-width:0;padding:6px 8px 6px 4px}.preset-item button.preset-delete:hover{color:#171612cc}.preset-control input[type=text]{color:#171612;width:64px;font:inherit;background:#ffffff80;border:1px solid #17161229;border-radius:999px;padding:6px 10px;font-size:11px}.preset-control input[type=text]:focus-visible{outline-offset:2px;outline:2px solid #171612a6}.paper-control,.wash-color-control,.ink-color-control{position:relative}.paper-control button,.wash-color-control button[data-wash-color],.ink-color-control button[data-ink-color]{cursor:pointer;appearance:none;border:1px solid #17161238;border-radius:999px;width:26px;min-width:0;height:26px;padding:0}.paper-control button.is-active{border-color:#171612;box-shadow:inset 0 0 0 2px #f4f1e8eb}.paper-control input[type=color],.wash-color-control input[type=color],.ink-color-control input[type=color]{opacity:0;pointer-events:none;appearance:none;border:0;width:26px;height:26px;margin:0;padding:0;position:absolute}.ink-color-control.has-names button[data-ink-color]{margin-bottom:12px;position:relative}.ink-color-control.has-names button[data-ink-color]:after{content:attr(data-short);white-space:nowrap;color:#17161299;pointer-events:none;font-size:10px;line-height:1;position:absolute;top:28px;left:50%;transform:translate(-50%)}.shadow-control button:focus-visible,.shadow-color-control input:focus-visible{outline-offset:2px;outline:2px solid #171612a6}.stroke-editor-toggle{z-index:30;top:max(14px, env(safe-area-inset-top));left:max(14px, env(safe-area-inset-left));color:#171612;cursor:pointer;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f4f1e8e6;border:1px solid #17161233;border-radius:999px;min-height:44px;padding:9px 14px;font:650 12px/1 system-ui,sans-serif;position:absolute;box-shadow:0 8px 24px #322c1f17}.stroke-editor-toggle[hidden]{display:none}.stroke-editor-toggle:focus-visible{outline-offset:3px;outline:3px solid #0067c5}.underline-color-control input[type=color]{cursor:pointer;background:0 0;border:1px solid #17161238;border-radius:999px;width:26px;height:26px;padding:0}.underline-color-control input[type=color].is-unset{opacity:.55;border-style:dashed}.underline-family-swatches{gap:4px;display:inline-flex}.underline-all-swatch,.underline-family-swatches label{color:#17161299;flex-direction:column;align-items:center;font-size:10px;line-height:1;display:inline-flex}.underline-color-control input[type=color].is-mixed::-webkit-color-swatch{background:conic-gradient(#a8283c,#d0642a,#c9a22e,#2d6fc0,#3a3438,#a8283c)!important}.underline-color-control input[type=color].is-mixed::-moz-color-swatch{background:conic-gradient(#a8283c,#d0642a,#c9a22e,#2d6fc0,#3a3438,#a8283c)!important}.underline-family-swatches input[type=color]{width:22px;height:22px}.letter-color-switch{cursor:pointer;align-items:center;gap:3px;font-size:11px;display:inline-flex}.letter-color-swatches{flex-wrap:wrap;gap:4px;display:inline-flex}.letter-color-swatches label{color:#17161299;flex-direction:column;align-items:center;font-size:10px;line-height:1;display:inline-flex}.letter-color-swatches input[type=color]{cursor:pointer;background:0 0;border:1px solid #17161238;border-radius:999px;width:22px;height:22px;padding:0}.letter-color-control.is-off .letter-color-swatches{opacity:.45}
