:root{color-scheme:light dark;font-family:system-ui,sans-serif}body{margin:0;min-height:100vh}#app{display:flex;flex-direction:column;gap:1rem;padding:1rem;max-width:100%;box-sizing:border-box}#app.left-handed{flex-direction:column-reverse}@media (min-width: 700px){#app{flex-direction:row}#app.left-handed{flex-direction:row-reverse}}.panel{display:flex;flex-direction:column;gap:.75rem;min-width:260px}.layer-list{border:1px solid color-mix(in srgb,currentColor 25%,transparent);border-radius:6px;max-height:240px;overflow-y:auto;padding:.25rem}.layer-row{display:flex;align-items:center;gap:.5rem;padding:.25rem}.layer-row.disabled{opacity:.5}.layer-row.active{background:color-mix(in srgb,currentColor 15%,transparent);border-radius:4px}.layer-name{flex:1;cursor:pointer;-webkit-user-select:none;user-select:none}.layer-thumb{flex-shrink:0;max-width:40px;max-height:40px;border:1px solid color-mix(in srgb,currentColor 30%,transparent);border-radius:3px;background:repeating-conic-gradient(#8883 0% 25%,transparent 0% 50%) 0 / 10px 10px;image-rendering:pixelated}.adjust-checkbox{display:flex;align-items:center;gap:.25rem;font-size:.85rem;opacity:.8}button.active{outline:2px solid currentColor}input[type=number]{width:5rem;font-size:1rem}.slider-row{display:flex;align-items:center;gap:.5rem}.slider-row label{width:3.5rem;flex-shrink:0}.slider-row input[type=range]{flex:1;height:2rem}.slider-row .value{width:3rem;text-align:right;font-variant-numeric:tabular-nums}.preview-area{position:relative;flex:1;display:flex;align-items:center;justify-content:center;background:repeating-conic-gradient(#8883 0% 25%,transparent 0% 50%) 0 / 20px 20px;border-radius:6px;min-height:300px;overflow:auto}.canvas-stack{position:relative;display:inline-block;line-height:0}.guide-overlay{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;pointer-events:none}.eraser-ring{position:absolute;display:none;border:1.5px dashed #333;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 0 0 1px #fffc}#preview-canvas{max-width:100%;max-height:70vh;image-rendering:pixelated;touch-action:none;background:#fff}button{padding:.6rem 1rem;font-size:1rem}
