.pencil-settings-toolbar{display:flex;align-items:center}.pencil-settings-toolbar .cursor-preview-dot{position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%);border-radius:50%;box-shadow:0 0 0 1px #fff,0 0 0 1.5px #33333380;pointer-events:none}.pencil-settings-toolbar .island{display:flex;align-items:center;padding:4px 8px!important}.pencil-settings-toolbar .pencil-color-button{height:32px;width:32px;min-width:32px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pencil-settings-toolbar .pencil-color-button .pencil-color-preview{width:20px;height:20px;border-radius:50%;border:2px solid var(--color-on-surface);box-sizing:border-box}.pencil-settings-toolbar .pencil-width-button,.pencil-settings-toolbar .size-picker-button{height:32px;width:32px;min-width:32px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pencil-settings-toolbar .pencil-width-button .pencil-width-icon,.pencil-settings-toolbar .pencil-width-button .size-picker-icon,.pencil-settings-toolbar .size-picker-button .pencil-width-icon,.pencil-settings-toolbar .size-picker-button .size-picker-icon{width:16px;height:16px;color:var(--color-on-surface)}.pencil-settings-toolbar .pencil-stroke-style-picker{display:flex;align-items:center;gap:2px;margin-left:4px;padding:2px;background:#0000000a;border-radius:6px}.pencil-settings-toolbar .pencil-stroke-style-picker .pencil-stroke-style-button{height:28px;width:28px;min-width:28px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .15s ease}.pencil-settings-toolbar .pencil-stroke-style-picker .pencil-stroke-style-button.active{background:#fff;box-shadow:0 1px 3px #0000001a}.pencil-settings-toolbar .pencil-stroke-style-picker .pencil-stroke-style-button:hover:not(.active){background:#0000000a}.pencil-settings-toolbar .pencil-width-input-wrapper,.pencil-settings-toolbar .size-picker-input-wrapper{display:flex;align-items:center;margin-left:8px;padding:0 12px;width:72px;height:32px;background:#f5f5f5;border-radius:16px;border:1px solid #e0e0e0;flex-shrink:0;box-sizing:border-box}.pencil-settings-toolbar .pencil-width-input-wrapper:focus-within,.pencil-settings-toolbar .size-picker-input-wrapper:focus-within{border-color:#1890ff}.pencil-settings-toolbar .pencil-width-input-wrapper .pencil-width-input,.pencil-settings-toolbar .pencil-width-input-wrapper .size-picker-input,.pencil-settings-toolbar .size-picker-input-wrapper .pencil-width-input,.pencil-settings-toolbar .size-picker-input-wrapper .size-picker-input{flex:1;width:100%;height:100%;border:none;background:transparent;font-size:14px;font-weight:500;text-align:left;color:#333}.pencil-settings-toolbar .pencil-width-input-wrapper .pencil-width-input:focus,.pencil-settings-toolbar .pencil-width-input-wrapper .size-picker-input:focus,.pencil-settings-toolbar .size-picker-input-wrapper .pencil-width-input:focus,.pencil-settings-toolbar .size-picker-input-wrapper .size-picker-input:focus{outline:none}.pencil-settings-toolbar .pencil-width-input-wrapper .pencil-width-input-unit,.pencil-settings-toolbar .pencil-width-input-wrapper .size-picker-input-unit,.pencil-settings-toolbar .size-picker-input-wrapper .pencil-width-input-unit,.pencil-settings-toolbar .size-picker-input-wrapper .size-picker-input-unit{font-size:12px;color:#bbb;flex-shrink:0;margin-left:4px}.pencil-settings-toolbar .pencil-pressure-switch{display:flex;align-items:center;justify-content:center;margin-left:8px;flex-shrink:0}.pencil-settings-toolbar .toolbar-divider{width:1px;height:20px;background:#e0e0e0;margin:0 4px;flex-shrink:0}.pencil-settings-toolbar .precise-eraser-switch{display:flex;align-items:center;gap:6px;padding:4px 6px;flex-shrink:0}.pencil-settings-toolbar .precise-eraser-switch .switch-label{font-size:12px;color:#666;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none}.pencil-settings-toolbar .pencil-shape-picker{display:flex;align-items:center;gap:2px;padding:2px;margin-left:4px;background:#0000000a;border-radius:6px}.pencil-settings-toolbar .pencil-shape-picker .pencil-shape-button{height:28px;width:28px;min-width:28px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .15s ease;color:#666}.pencil-settings-toolbar .pencil-shape-picker .pencil-shape-button.active{background:#fff;box-shadow:0 1px 3px #0000001a;color:#333}.pencil-settings-toolbar .pencil-shape-picker .pencil-shape-button:hover:not(.active){background:#0000000a}.pencil-settings-toolbar .eraser-shape-picker{display:flex;align-items:center;gap:2px;padding:2px;background:#0000000a;border-radius:6px}.pencil-settings-toolbar .eraser-shape-picker .eraser-shape-button{height:28px;width:28px;min-width:28px;padding:0;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .15s ease;color:#666}.pencil-settings-toolbar .eraser-shape-picker .eraser-shape-button.active{background:#fff;box-shadow:0 1px 3px #0000001a;color:#333}.pencil-settings-toolbar .eraser-shape-picker .eraser-shape-button:hover:not(.active){background:#0000000a}.stroke-setting{min-width:200px}.stroke-width-picker,.size-picker-popover{min-width:200px;background:#fff;border-radius:8px}.stroke-width-picker .stroke-width-value,.stroke-width-picker .size-picker-value,.size-picker-popover .stroke-width-value,.size-picker-popover .size-picker-value{font-variant-numeric:tabular-nums;font-family:var(--font-family-mono, monospace);background:#0000000a;padding:2px 6px;border-radius:4px;text-align:center}.stroke-width-picker .stroke-width-slider-wrapper,.stroke-width-picker .size-picker-slider-wrapper,.size-picker-popover .stroke-width-slider-wrapper,.size-picker-popover .size-picker-slider-wrapper{flex:1;display:flex;align-items:center;min-width:140px;margin-top:7px}.stroke-width-picker .t-slider,.size-picker-popover .t-slider{padding:0 4px!important}@media(max-width:768px){.pencil-settings-toolbar{max-width:calc(100vw - 260px)}.pencil-settings-toolbar .island{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-wrap:nowrap;padding:3px 4px!important;gap:2px}.pencil-settings-toolbar .island::-webkit-scrollbar{display:none}.pencil-settings-toolbar .cursor-preview-dot{display:none}.pencil-settings-toolbar .pencil-color-button,.pencil-settings-toolbar .pencil-width-button,.pencil-settings-toolbar .size-picker-button{flex-shrink:0;height:26px;width:26px;min-width:26px}.pencil-settings-toolbar .pencil-stroke-style-picker,.pencil-settings-toolbar .eraser-shape-picker{flex-shrink:0;padding:1px;gap:1px}.pencil-settings-toolbar .pencil-stroke-style-picker .pencil-stroke-style-button,.pencil-settings-toolbar .pencil-stroke-style-picker .eraser-shape-button,.pencil-settings-toolbar .eraser-shape-picker .pencil-stroke-style-button,.pencil-settings-toolbar .eraser-shape-picker .eraser-shape-button{height:24px;width:24px;min-width:24px}.pencil-settings-toolbar .pencil-width-input-wrapper,.pencil-settings-toolbar .size-picker-input-wrapper{display:none}.pencil-settings-toolbar .toolbar-divider{height:14px;margin:0 1px;flex-shrink:0}.pencil-settings-toolbar .precise-eraser-switch{flex-shrink:0;padding:2px}.pencil-settings-toolbar .precise-eraser-switch .switch-label{display:none}.pencil-settings-toolbar .pencil-pressure-switch{flex-shrink:0;margin-left:4px}}@media(max-width:640px){.pencil-settings-toolbar{max-width:calc(100vw - 200px)}}@media(max-width:480px){.pencil-settings-toolbar{max-width:calc(100vw - 220px)}.pencil-settings-toolbar .island{padding:2px 3px!important}}