.pen-settings-toolbar{display:flex;align-items:center}.pen-settings-toolbar .island{display:flex;align-items:center;padding:4px 8px!important}.pen-settings-toolbar .pen-color-button{height:32px;width:32px;min-width:32px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pen-settings-toolbar .pen-color-button .pen-color-preview{width:20px;height:20px;border-radius:50%;border:2px solid var(--color-on-surface);box-sizing:border-box}.pen-settings-toolbar .pen-width-button{height:32px;width:32px;min-width:32px;padding:0;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pen-settings-toolbar .pen-width-button .pen-width-icon{width:16px;height:16px;color:var(--color-on-surface)}.pen-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}.pen-settings-toolbar .size-picker-button .size-picker-icon{width:16px;height:16px;color:var(--color-on-surface)}.pen-settings-toolbar .pen-stroke-style-picker{display:flex;align-items:center;gap:2px;margin-left:4px;padding:2px;background:#0000000a;border-radius:6px}.pen-settings-toolbar .pen-stroke-style-picker .pen-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}.pen-settings-toolbar .pen-stroke-style-picker .pen-stroke-style-button.active{background:#fff;box-shadow:0 1px 3px #0000001a}.pen-settings-toolbar .pen-stroke-style-picker .pen-stroke-style-button:hover:not(.active){background:#0000000a}.pen-settings-toolbar .pen-width-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}.pen-settings-toolbar .pen-width-input-wrapper:focus-within{border-color:#1890ff}.pen-settings-toolbar .pen-width-input-wrapper .pen-width-input{flex:1;width:100%;height:100%;border:none;background:transparent;font-size:14px;font-weight:500;text-align:left;color:#333}.pen-settings-toolbar .pen-width-input-wrapper .pen-width-input:focus{outline:none}.pen-settings-toolbar .pen-width-input-wrapper .pen-width-input-unit{font-size:12px;color:#bbb;flex-shrink:0;margin-left:4px}.pen-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}.pen-settings-toolbar .size-picker-input-wrapper:focus-within{border-color:#1890ff}.pen-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}.pen-settings-toolbar .size-picker-input-wrapper .size-picker-input:focus{outline:none}.pen-settings-toolbar .size-picker-input-wrapper .size-picker-input-unit{font-size:12px;color:#bbb;flex-shrink:0;margin-left:4px}.pen-settings-toolbar .pen-settings-divider{width:1px;height:24px;background:#0000001a;margin:0 8px;flex-shrink:0}.pen-settings-toolbar .pen-anchor-type-picker{display:flex;align-items:center;gap:2px;padding:2px;background:#0000000a;border-radius:6px}.pen-settings-toolbar .pen-anchor-type-picker .pen-anchor-type-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}.pen-settings-toolbar .pen-anchor-type-picker .pen-anchor-type-button.active{background:#fff;box-shadow:0 1px 3px #0000001a}.pen-settings-toolbar .pen-anchor-type-picker .pen-anchor-type-button:hover:not(.active){background:#0000000a}@media(max-width:768px){.pen-settings-toolbar{max-width:calc(100vw - 250px)}.pen-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}.pen-settings-toolbar .island::-webkit-scrollbar{display:none}.pen-settings-toolbar .pen-color-button,.pen-settings-toolbar .pen-width-button,.pen-settings-toolbar .size-picker-button{flex-shrink:0;height:26px;width:26px;min-width:26px}.pen-settings-toolbar .pen-stroke-style-picker,.pen-settings-toolbar .pen-anchor-type-picker{flex-shrink:0;padding:1px;gap:1px}.pen-settings-toolbar .pen-stroke-style-picker .pen-stroke-style-button,.pen-settings-toolbar .pen-stroke-style-picker .pen-anchor-type-button,.pen-settings-toolbar .pen-anchor-type-picker .pen-stroke-style-button,.pen-settings-toolbar .pen-anchor-type-picker .pen-anchor-type-button{height:24px;width:24px;min-width:24px}.pen-settings-toolbar .pen-width-input-wrapper,.pen-settings-toolbar .size-picker-input-wrapper{display:none}.pen-settings-toolbar .pen-settings-divider{flex-shrink:0;height:14px;margin:0 2px}}@media(max-width:640px){.pen-settings-toolbar{max-width:calc(100vw - 200px)}}@media(max-width:480px){.pen-settings-toolbar{max-width:calc(100vw - 180px)}.pen-settings-toolbar .island{padding:2px 3px!important}}