.canvas-drawing-layer{position:absolute;left:0;top:0;width:1px;height:1px;overflow:visible;transform-origin:0 0;pointer-events:none;z-index:10}
.canvas-drawing-layer [data-drawing-id]{pointer-events:none}
.canvas-drawing-hit{pointer-events:all;cursor:move}
.canvas-drawing-shape{pointer-events:visiblePainted}
#lovartCanvasWrap.is-drawing-tool,#lovartCanvasWrap.is-drawing-tool .canvas-drawing-hit{cursor:crosshair}
#lovartCanvasWrap.is-space-pan,#lovartCanvasWrap.is-space-pan *{cursor:grab!important}
#lovartCanvasWrap.is-space-pan.is-panning,#lovartCanvasWrap.is-space-pan.is-panning *{cursor:grabbing!important}
.canvas-drawing-controls{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;height:38px;padding:4px 10px;border:1px solid #383838;border-radius:12px;color:#aaa;background:#202020;z-index:35;font:12px/18px system-ui}
.canvas-drawing-controls[hidden],.canvas-drawing-notice[hidden]{display:none}
.canvas-drawing-controls .drawing-color-chip{width:24px;height:24px;padding:0;border:1px solid #777;border-radius:50%;flex:none}
.canvas-drawing-controls input[type=number]::-webkit-inner-spin-button{appearance:none}
.drawing-color-panel{position:fixed;inset:auto;margin:0;box-sizing:border-box;width:280px;padding:16px;border:1px solid #373737;border-radius:16px;background:#202020;color:#eee;box-shadow:0 10px 30px #0004;font:13px/20px system-ui}
.drawing-color-panel header{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-weight:500}
.drawing-color-panel header button{background:none;color:#ddd;border:0;font-size:24px;cursor:pointer}
.drawing-sv{height:160px;position:relative;border-radius:9px;background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent);touch-action:none;cursor:crosshair}
.drawing-sv i{position:absolute;width:12px;height:12px;border:2px solid white;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 2px #000;pointer-events:none}
.drawing-hue{appearance:none;width:100%;height:12px;border-radius:10px;background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red);margin:18px 0}
.drawing-hue::-webkit-slider-thumb{appearance:none;width:17px;height:17px;border:3px solid white;border-radius:50%;background:transparent;cursor:pointer}
.drawing-swatches{display:flex;justify-content:space-between;gap:8px;margin:0 0 14px}
.drawing-swatches button{width:27px;height:27px;border:1px solid #777;border-radius:50%;cursor:pointer}
.drawing-swatches button:focus-visible{outline:2px solid #4388ff;outline-offset:2px}
.drawing-hex{display:flex;align-items:center;gap:8px;background:#333;border-radius:8px;padding:8px 10px;color:#999}
.drawing-hex input{width:100%;background:none;border:0;outline:none;color:#eee;font:13px system-ui}
.drawing-opacity{appearance:none;width:calc(100% - 42px);height:12px;border-radius:10px;background:linear-gradient(to right,transparent,var(--drawing-color)),repeating-conic-gradient(#777 0% 25%,#aaa 0% 50%) 0/8px 8px;vertical-align:middle;margin:0 8px 15px 0}
.drawing-opacity::-webkit-slider-thumb{appearance:none;width:17px;height:17px;border:3px solid white;border-radius:50%;background:transparent;cursor:pointer}
.drawing-opacity-value{display:inline-block;width:34px;font-size:12px;color:#aaa;vertical-align:top}
.canvas-drawing-controls input[type=color]{width:22px;height:22px;appearance:none;padding:0;border:0;border-radius:50%;background:none;cursor:pointer}
.canvas-drawing-controls input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.canvas-drawing-controls input[type=color]::-webkit-color-swatch{border:1px solid #777;border-radius:50%}
.canvas-drawing-controls input[type=number]{width:42px;border:0;outline:none;text-align:right;background:transparent;color:#ddd;font:12px system-ui;appearance:textfield}
.canvas-drawing-controls button,.canvas-drawing-notice button{font:12px/18px system-ui;padding:4px 7px;color:#ddd;border:0;border-radius:5px;background:#333;cursor:pointer}
.canvas-drawing-editor{position:absolute;z-index:36;resize:both;box-sizing:border-box;max-width:calc(100% - 20px);min-width:80px;padding:3px;border:1px solid #4388ff;border-radius:2px;background:#202020ed;font-family:system-ui,sans-serif;outline:none}
.canvas-drawing-notice{position:absolute;top:14px;left:14px;display:flex;align-items:center;gap:8px;max-width:calc(100% - 28px);padding:8px 10px;color:#c9c9c9;background:#242424;border:1px solid #3b3b3b;border-radius:9px;z-index:36;font:12px/18px system-ui}
.canvas-drawing-notice span{max-width:380px}.canvas-drawing-notice button{white-space:nowrap}
#lovartEmpty.drawing-objects-present{display:none!important}
@media(max-width:800px){.canvas-drawing-notice{flex-wrap:wrap}.canvas-drawing-controls{max-width:calc(100% - 24px)}}