.annotation-dialog-container { padding: 12px 16px 16px; box-sizing: border-box; } .annotation-dialog-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; } .annotation-dialog-title { font-size: 15px; font-weight: 600; } .annotation-dialog-close { font-size: 18px; cursor: pointer; opacity: 0.6; transition: opacity 0.15s; } .annotation-dialog-close:hover { opacity: 1; } .annotation-dialog-section { margin-bottom: 14px; } .annotation-dialog-section:last-child { margin-bottom: 0; } .annotation-dialog-label { font-size: 13px; margin-bottom: 8px; opacity: 0.75; } .annotation-color-list { display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; } .annotation-color-item { width: 26px; height: 26px; border-radius: 50%; cursor: pointer; box-sizing: border-box; border: 2px solid transparent; transition: border-color 0.15s, transform 0.15s; } .annotation-color-item:hover { transform: scale(1.1); } .active-annotation-color-item { border-color: rgba(0, 0, 0, 0.4); } .annotation-width-list { display: flex; align-items: center; gap: 14px; margin: 0; padding: 0; list-style: none; } .annotation-width-item { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; cursor: pointer; box-sizing: border-box; border: 2px solid transparent; transition: border-color 0.15s, background-color 0.15s; } .annotation-width-item:hover { background-color: rgba(0, 0, 0, 0.05); } .active-annotation-width-item { border-color: rgba(0, 0, 0, 0.4); } .annotation-width-preview { display: block; width: 26px; }